Webpack 5 带来的 Scope Universe（范围宇宙）并不是某个单独暴露给用户的配置项，而是一套内建于依赖图构建阶段的模块作用域分析体系。它的核心目标，是弥补过去版本在 tree shaking 时对跨模块变量引用关系判断过于保守的问题。在旧版编译流程中，只要一个模块存在可能被外部访问的导出，整个模块内的很多定义都会被保留，即便其中大部分函数根本没有被任何其他文件调用。Scope Universe 通过更细粒度的词法作用域追踪，把每一个标识符的声明、赋值与引用都放进一张统一的“宇宙”图谱中，从而精确识别哪些导出是孤岛。
Scope Universe 的底层原理与静态分析过程
要理解范围宇宙，首先要明白 Webpack 在打包时如何表示模块。每一个被加载的源文件都会经过解析器生成抽象语法树，然后转化成依赖图里的 Module 对象。在 Webpack 4 及之前，导出分析主要依赖 harmony export 语句的静态结构，对于间接引用、重新导出以及通过对象属性透传的情况，分析器往往选择保留整条链路。Scope Universe 则在这一步之后插入了一个作用域推导阶段：它会模拟类似编译型语言的符号表，把模块内 top-level 的 let、const、function 以及 class 全部登记到全局符号空间，并记录它们是否被其他模块的 import 绑定。
这种符号空间的“宇宙”视角，使得跨文件的死代码识别成为可能。例如模块 A 导出了 a1 和 a2，模块 B 只 import 了 a1，而 a2 内部又引用了模块 C 的某些方法，但模块 C 的其他导出未被任何人使用。在旧模型中，为了安全，a2 与模块 C 的相关代码可能都被保留；在 Scope Universe 下，由于 a2 没有任何活动引用，它和它独有依赖的局部分支会被打上 unused 标记。随后在优化阶段，这些分支会被 concatenation 或压缩插件剔除。
值得注意的是，范围宇宙并不是万能的。它依赖 ECMAScript 模块的静态语法结构，一旦代码中出现了动态 export 或者基于 eval 的赋值，分析器就会退化为保守模式，将该模块的所有导出视为潜在存活。因此我们在编写库代码时，应尽量避免在模块顶层使用 Object.defineProperty(exports, ...) 这类运行期导出手法，而采用标准的 export 声明，才能充分利用这套机制。
与 Webpack 4 导出分析的实战差异对比
我们可以通过一个具体例子来看差异。假设有一个工具模块 util.js，里面定义了五个纯函数，但业务代码只用了其中一个。在 Webpack 4 默认配置且未开启深度压缩的场景下，如果 util.js 中存在一个未被识别为无副作用的数组遍历副作用，其余四个函数可能因为无法证明“不被引用”而留在包中。Webpack 5 开启 Scope Universe 后，只要项目 package.json 标明了 sideEffects 字段或函数体确实无副作用，另外四个函数就会进入死代码集合。
下面是一段模拟工具模块的源码，以及它在两种分析模型下的不同命运：
// util.js
export function formatDate() { return '2024'; }
export function parseQuery() { return {}; }
export function unusedA() { return 1; }
export function unusedB() { return 2; }
export function unusedC() { console.log('side'); return 3; }
// app.js
import { formatDate } from './util.js';
console.log(formatDate());
在 Webpack 4 里，unusedA、unusedB、unusedC 是否移除取决于压缩器能否跨文件证明它们无引用；Scope Universe 在编译初期就标记了这三个导出为未使用，Terser 后续直接删除对应节点。我们通过对比构建产物可以发现，Webpack 5 的产物体积通常能减少百分之几到十几，具体比例随项目冗余度而变化。
此外，Scope Universe 对重新导出（re-export）也更友好。旧版中 export * from './x.js' 常常让 tree shaking 失效，因为分析器不知道外部到底需要 x 的哪些导出。新模型会顺着星号导出回溯到原模块的符号表，只把实际被引用的那部分保留，其余静默丢弃。这对使用大型组件库但只引入个别组件的前端工程尤其有利。
在项目中落地 Scope Universe 的注意事项与优化建议
虽然 Scope Universe 是 Webpack 5 的内置能力，但要让它发挥最大效用，工程配置仍需配合。首先，必须在 package.json 中正确声明 sideEffects。如果写成 "sideEffects": true 却实际存在大量无副作用文件，分析器会放弃裁剪；推荐写成数组列出有副作用的文件，或设为 false 表示全部无副作用。其次，尽量使用 ESM 语法，避免混用 CommonJS 的 module.exports，因为后者在静态分析时难以还原精确的导出映射。
另一个常见坑是循环依赖。当两个模块互相 import 时，Scope Universe 为了保证运行期语义，往往会对部分导出采取保守保留。此时可以通过重构把共享状态抽到第三个无循环依赖的模块中，从而恢复作用域宇宙的裁剪能力。同时，在编写高频调用的工具函数时，减少模块顶层的对象字面量副作用，也能降低分析器退化的概率。
最后，建议结合 webpack --stats usedExports 命令观察每个模块的导出使用情况。如果看到某个明明没用的导出仍被标记为 used，就需要检查是否存在动态引用或隐式全局赋值。通过持续打磨模块写法，Scope Universe 才能真正把“范围宇宙”里无用的星辰一颗颗抹去，让交付包体保持轻盈。
Webpack5Scope_Universe模块作用域修改时间：2026-08-15 00:42:35