webpack使用tree shaking示例:

在webpack5中,打包模式production时才开启

javascript 复制代码
module.exports = {
    entry: './src/index.js',
    output: {
        filename: 'main.js',
    },
    mode: 'production',
}

webpack在打包时,tree shaking会自动运行,webpack会解析代码 构建依赖图谱 标记未使用的模块和代码,并在最终打包结果中移除未使用的代码。

javascript 复制代码
webpack.config.js
module.exports = {
    entry: './src/index.js',
    output: {
        filename: 'main.js',
    },
    mode: 'production', // 或者 'production'
}
javascript 复制代码
src/index.js
import { ttt } from './util.js'

function testfn() {
    return 'test'
}

let a = 1
a+=1

src/util.js
export const ttt = '123ttt'
相关推荐
XiaoYu2002几秒前
第1章 核心竞争力和职业规划
前端·面试·程序员
excel5 分钟前
🧩 深入浅出讲解:analyzeScriptBindings —— Vue 如何分析 <script> 里的变量绑定
前端
蓝瑟8 分钟前
AI时代程序员如何高效提问与开发工作?
前端·ai编程
林晓lx38 分钟前
使用Git钩子+ husky + lint语法检查提高前端项目代码质量
前端·git·gitlab·源代码管理
王同学要变强1 小时前
【深入学习Vue丨第二篇】构建动态Web应用的基础
前端·vue.js·学习
程序定小飞1 小时前
基于springboot的web的音乐网站开发与设计
java·前端·数据库·vue.js·spring boot·后端·spring
Hello_WOAIAI1 小时前
2.4 python装饰器在 Web 框架和测试中的实战应用
开发语言·前端·python
FinClip1 小时前
凡泰极客亮相香港金融科技周,AI助力全球企业构建超级应用
前端
阿四2 小时前
【Nextjs】为什么server action中在try/catch内写redirect操作会跳转失败?
前端·next.js
申阳2 小时前
Day 6:04. 基于Nuxt开发博客项目-LOGO生成以及ICON图标引入
前端·后端·程序员