https://plumephp.com/tags/%E6%91%87%E6%A0%91/Recent content in 摇树 on PlumePHPHugozh-CNTue, 29 Sep 2026 11:00:00 +0800https://plumephp.com/vite-tree-shaking-deep-dive/Tue, 29 Sep 2026 11:00:00 +0800https://plumephp.com/vite-tree-shaking-deep-dive/<h2 id="引言">引言</h2> <p>「打包出来的文件怎么这么大」往往是同一个原因：<strong>Tree-shaking 没生效</strong>。摇树（Tree-shaking）是 Rollup/Vite 的核心优化，能把「没用的导出」从产物里删掉，但它的生效有一整套前提：ESM 的静态分析、副作用标记、package.json 字段、代码的可摇性。本文讲透摇树：先讲原理（按使用标记 + 删除未用）、为什么必须 ESM（静态可分析，CommonJS 摇不动）、副作用标记 sideEffects（<code>&quot;sideEffects&quot;: false</code> 让包可摇）、package.json 的 exports 与 module 字段（入口该指向 ESM）、摇树的边界（动态导入/运行时/条件导入摇不掉）、常见摇树失败与排查（副作用误判/入口错误/黑魔法）、库作者的摇树优化（怎么写可摇的库）、与代码分割的配合（摇树 + 分割的组合策略）、最后是验证摇树效果（产物分析看包体）。</p>