Tree Shaking 能移除未使用的 ES 模块工具函数，前提是静态导出、无引用、无副作用；需用命名导入/导出，避免默认导出和动态赋值，并通过 sideEffects 配置或 /#__PURE__/ 注释辅助识别纯函数，最终须验证产物。
Tree Shaking 能移除未使用的工具函数，但前提是这些函数必须是 ES 模块静态导出的、未被任何地方引用的、且没有副作用的。它不是靠运行时分析，而是依赖打包工具（如 Webpack、Vite、Rollup）在构建时对 import/export 语句做静态语法分析，识别出“死代码”并剔除。
确保工具函数以 ES 模块方式导出
CommonJS（module.exports / require）不支持 Tree Shaking；只有 export 和 import 才能被静态分析。
- ✅ 正确写法（命名导出）：
// utils.js<br>export const formatDate = (date) => new Date(date).toDateString();<br>export const debounce = (fn, wait) => { /* ... */ };<br>export const throttle = (fn, limit) => { /* ... */ };- ❌ 避免混合导出或动态赋值（会破坏静态可分析性）：
// ❌ 不推荐：对象导出 + 动态属性<br>const helpers = {<br> formatDate,<br> debounce<br>};<br>export default helpers;按需导入，避免默认导入整个模块
如果使用 import utils from './utils.js'（默认导入），即使只用其中一个函数，整个模块也可能无法被摇掉——因为默认导出被视为一个整体单元。
- ✅ 推荐：命名导入，只引入实际用到的函数
import { formatDate } from './utils.js'; // 只有 formatDate 会被保留<br>// debounce 和 throttle 就有机会被 Tree Shaking 移除- ⚠️ 注意：如果模块里有副作用（比如执行了 console.log 或修改全局变量），即使没被引用，也不会被移除（除非显式标记无副作用）
告诉打包工具该模块无副作用
某些工具函数文件虽然只做纯计算，但打包器可能因保守策略保留它们。可在 package.json 中声明：
立即学习“Java免费学习笔记（深入）”；
{<br> "sideEffects": false<br>}或更精细地指定哪些文件无副作用：
{<br> "sideEffects": ["*.css", "*.scss"] // 只有这些文件有副作用，其余 JS 全可摇也可在源码中加注释提示（Webpack 支持）：
// utils.js<br>/*#__PURE__*/ export const noop = () => {};检查最终产物确认是否生效
别只信配置——要验证结果：
- 构建后查看
dist目录中的 JS 文件，搜索未使用的函数名是否还存在 - 使用 Webpack 的 Webpack Bundle Analyzer 可视化依赖图谱
- Vite 用户可用
vite build --report生成report.html查看模块引用关系
如果发现本该被摇掉的函数还在产物里，大概率是：被间接引用（比如通过字符串拼接 import）、有隐式副作用、或用了非静态 import（如 import(...) 动态导入）。
