tree shaking 是基于 es6 模块静态分析的未使用代码移除机制，需满足使用 import/export、工具正确配置、无副作用干扰等前提，并通过具名导出、按需引入等方式优化代码写法以提升效果。
JavaScript 中使用具名导出（named export）配合 Tree Shaking 减少打包体积，关键在于确保导出和导入方式满足模块静态分析要求，且构建工具（如 Webpack、Vite、Rollup）能准确识别未使用的导出并剔除。
确保使用 ES 模块语法
Tree Shaking 依赖静态结构分析，只有 export / import 语法才能被识别。CommonJS（module.exports / require）不支持 Tree Shaking。
- ✅ 正确（ESM）：
export const foo = () => {};或export function bar() {} - ❌ 错误（CommonJS）：
module.exports = { foo: () => {} };—— 即使在 ESM 文件里混用也会破坏 shaking
避免动态导入或赋值导致的副作用
如果导出对象被修改、解构后重赋值、或通过非字面量方式访问，会阻碍静态分析。
deep-java-review
下载
Java项目代码review工具。分析Git变更+完整调用链路上下文，推断业务需求，进行多维度评分和分类汇总，生成完整PRD文档。包含细粒度Java代码审查清单（Null安全、异常处理、Streams、并发、equals/hashCode、资源管理、API设计、性能、MyBatis/ORM、事务边界、SQL/DD...
- ✅ 安全写法：
export const utils = { a: 1, b: 2 };+import { a } from './utils.js'; - ❌ 风险写法：
const obj = {}; obj.c = 3; export { obj };—— 构建工具可能认为整个obj有副作用而保留 - ⚠️ 注意：默认导出（
export default）本身不参与 Tree Shaking；但若默认导出是具名导出的重命名（如export { foo as default }），仍可被 shake
按需导入，不使用 namespace 导入
使用解构式具名导入，让构建工具明确知道只用到哪些成员；避免 import * as mod from，它会阻止对整个模块的摇树。
- ✅ 推荐：
import { debounce, throttle } from 'lodash-es';（注意用lodash-es而非lodash） - ❌ 不推荐：
import * as _ from 'lodash-es';或import _ from 'lodash-es';（后者是默认导入，且通常指向非 esm 入口） - ? 提示：库必须提供真正的 ESM 版本（即
"type": "module"或"exports": { ".": { "import": "./index.mjs" } }），否则即使写了import { x } from 'pkg'，也可能回退到打包整个 CJS 文件
检查构建配置与库兼容性
即使代码写得规范，若构建工具未启用相关优化或库未正确导出，Tree Shaking 仍会失效。
- Webpack：确认
mode: 'production'（自动开启optimization.usedExports: true） - Vite/Rollup：默认启用，但需确保
build.rollupOptions.treeshake: true（通常默认开启） - 验证方法：查看最终打包产物（如 Webpack 的
stats.json或 Vite 的report.html），搜索未引用的导出是否被标记为unused export - 常见陷阱：某些工具链（如 Babel）若将
export编译成Object.defineProperty(exports, ...)，会破坏静态分析——应禁用@babel/preset-env对模块语法的转换（设置modules: false）
Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南
