javascript tree shaking 的删除阶段依赖于 es module 的静态结构特性，通过抽象语法树（ast）分析标记未使用的导出，并在代码生成阶段将其剔除。具体做法是解析源码构建 ast，利用深度优先搜索遍历模块依赖图以识别死代码，最后由打包工具在输出时移除这些节点。这一过程要求代码必须使用 import 和 export 语法，且不能包含动态导入或副作用，否则无法安全地进行静态分析。
如何确定哪些导出是未使用的
确定未使用导出的核心在于建立调用方与提供方之间的引用关系。打包工具会遍历所有入口文件及其依赖，记录每个模块中哪些标识符被实际引用。如果某个 export 声明在任何地方都没有被 import，它就被标记为死代码。例如，在一个库中导出了多个工具函数，但应用只调用了其中一个，其他未被引用的函数就会被判定为无用。这个过程通常发生在依赖图的构建阶段，通过分析 ImportDeclaration 和 ExportNamedDeclaration 等 AST 节点来收集信息。
const fs = require('fs');
const path = require('path');
// 模拟一个简单的模块分析器
function analyzeModule(filePath) {
const code = fs.readFileSync(filePath, 'utf-8');
// 在实际工具中，这里会使用 acorn 或 babel-parser 解析为 AST
// 此处简化为正则匹配演示逻辑
const exports = code.match(/export\s+(?:default\s+)?(?:function|class|const|let|var)\s+(\w+)/g);
const imports = code.match(/import\s+.*?from\s+['"]([^'"]+)['"]/g);
console.log(`File: ${filePath}`);
console.log('Exports:', exports ? exports.map(e => e.split(' ')[3]) : []);
console.log('Imports:', imports ? imports.map(i => i.match(/from\s+['"]([^'"]+)['"]/)[1]) : []);
}
analyzeModule('./src/index.js');
Tree Shaking 对副作用代码的处理限制
Tree Shaking 在处理带有副作用的代码时会受到严格限制。如果模块在执行时会改变全局状态或产生外部影响，打包工具默认不能安全地删除该模块，即使其导出未被使用。这是因为删除模块可能会改变程序的运行行为。开发者可以通过 package.json 中的 sideEffects 字段明确告知打包工具哪些文件没有副作用。当设置为 false 或指定排除特定文件时，工具可以大胆地移除那些虽然引入了但未使用的模块。这种机制确保了在优化体积的同时，不会破坏依赖全局状态的逻辑。
// package.json 配置示例
{
"name": "my-library",
"sideEffects": false
}
基于未使用导出标记的具体清理结果
当程序成功识别出未使用的导出后，删除阶段会将这些代码从最终的 bundle 中彻底移除。以之前的示例为例，如果 utils.js 导出了 add 和 subtract，而 index.js 只导入了 add，那么 subtract 的定义及其相关逻辑将在最终输出的 JavaScript 文件中消失。这不仅减少了文件大小，还提高了加载速度。需要注意的是，如果代码中存在隐式依赖，比如通过字符串访问属性或使用 eval，Tree Shaking 可能无法准确识别并保留必要的代码，导致运行时错误。因此，保持代码的纯函数式和静态可分析性是关键。
Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南
