Webpack 开启 Scope Hoisting 后模块变量被压缩导致报错？

博主欢欢提问于 2026-03-27 12:51:17 阅读 34

工具

我最近在项目里启用了 Webpack 的 Scope Hoisting（ModuleConcatenationPlugin），结果打包后发现有些模块里的变量名被压缩重命名了，导致运行时报错说某个函数找不到。明明开发环境是正常的，这是怎么回事？

比如下面这个模块，在打包后 utils 被重命名为别的名字，但调用的地方没更新：

import { formatDate } from './utils';

export function displayDate(date) {
  return formatDate(date);
}

我来解答赞 11 收藏

反馈

1 条解答

常青 Lv1

看起来是 Scope Hoisting 和 Terser 插件的协同问题。Scope Hoisting 把模块合并了，但变量名重命名没处理好。

先检查下 Webpack 配置里 Terser 的配置，尤其是 mangle 选项。你可能需要给一些函数和变量加个标识来避免被压缩改名。试试这样：

import { formatDate } from './utils';



export function displayDate(date) {

  return /*#__PURE__*/ formatDate(date);

}

/#__PURE__/ 这个注释能让 Terser 知道这个调用不要优化得太狠。

如果还不行，调试看看 utils 模块有没有被正确合并。有时候插件顺序也会影响，确保 ModuleConcatenationPlugin 在 Terser 之前运行。要是折腾半天还是不行，考虑暂时关掉 Scope Hoisting，先把问题定位清楚再说。这玩意儿有时为了点性能提升反而添堵。

2026-03-27 13:00