启用 usedExports 是 Tree Shaking 的关键前提，需配合 minimize 才能真正删除未使用导出；仅支持 ES 模块，须精确导入且配合 sideEffects 声明副作用，验证时可通过注释标记确认分析是否生效。
直接在 Webpack 配置中开启 usedExports 即可启用基于导出使用情况的死代码分析，它是 Tree Shaking 的关键前提之一。
基础配置方式
该选项需配合代码压缩（minimize: true）才能真正移除未使用的导出。单独开启 usedExports 只会做标记，不会删代码。
- 在
webpack.config.js的optimization中显式设置：
module.exports = {
mode: 'development', // 开发模式下也可用，不依赖 production
optimization: {
usedExports: true, // 启用导出使用分析
minimize: true // 必须开启，否则不会删除未用导出
}
};Webpack 5+ 默认在 mode: 'production' 下自动启用这两项，但若想在开发环境验证效果，需手动写明。
确保模块符合 ES 模块规范
usedExports 仅对 export / import 语法生效，CommonJS（require/module.exports）无法被静态分析，自然不参与 Tree Shaking。
立即学习“Java免费学习笔记（深入）”；
- 导出必须是具名或默认导出，且不能动态生成（如
export const obj = {}后再赋值属性） - 导入要精确引用，避免
import * as utils from './utils'—— 这会让所有导出都被视为“已使用” - 推荐写法：
import { formatTime } from './date.js'或import formatTime from './date.js'（对应 default export）
配合 sideEffects 控制副作用模块
即使某个模块的导出没被引用，如果它有副作用（如执行全局样式注入、修改原型），Webpack 默认保留整个模块。这时需通过 sideEffects 显式声明。
- 在
package.json中设为false：表示项目内所有模块都无副作用，未引用的导出可安全剔除 - 设为数组（如
["*.css", "*.scss"]）：仅保留匹配文件的副作用，其他 JS 模块仍可被摇掉 - 注意：CSS 文件本身不支持内部 Tree Shaking（比如未用的 CSS 类名），
sideEffects只控制“是否引入该文件”，不处理文件内部内容
验证是否生效
最直观的方式是关闭压缩后查看打包产物：
- 先临时禁用
minimize，保留usedExports: true，然后构建 - 打开生成的 JS 文件，搜索未使用的函数或变量名 —— 若仍存在，说明未被标记；若变成
/* unused export xxx */注释，则分析已生效 - 再开启
minimize，这些标记部分就会被 TerserPlugin 真正删除
