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'
相关推荐
编代码的小王2 分钟前
【无标题】
前端·css
im_AMBER11 分钟前
React 20 useState管理组件状态 | 解构 | 将事件处理函数作为 props 传递 | 状态提升
前端·javascript·笔记·学习·react.js·前端框架
小oo呆12 分钟前
【自然语言处理与大模型】LangChainV1.0入门指南:核心组件Tools
前端·javascript·easyui
Asurplus12 分钟前
Centos7安装Node.js环境
centos·node.js·nvm·nodesource
亿元程序员16 分钟前
你知道三国志战略版是怎么实现横竖屏动态切换的吗?
前端
BD_Marathon18 分钟前
Vue3_双向绑定
前端·javascript·vue.js
霍理迪28 分钟前
CSS复合、关系、属性、伪类选择器
前端·javascript·css
棒棒的唐29 分钟前
Avue2图片上传使用object对象模式时,axios的请求模式用post还是get?
开发语言·前端·javascript·avue
OnlyEasyCode34 分钟前
Linux部署Nginx前后端web教程
linux·前端·nginx
梵得儿SHI35 分钟前
Vue Router 路由管理从入门到精通:基础、导航与参数传递实战(含避坑指南)
前端·javascript·vue.js·路由基础配置·版本适配·路由实例创建·路由规则定义