Terser压缩时移除仅在HTML中调用的函数，该如何解决？

你的核心问题在于开启了module: true和toplevel: true后，Terser会将文件按ES模块处理——模块内的函数默认处于模块私有作用域，HTML中的全局调用无法访问到它，同时toplevel: true会主动清理顶层未被引用/导出的代码，哪怕dead_code: false也无法阻止这个行为。

以下是可行的解决办法：

• 将函数挂载到全局对象
  把需要在HTML中调用的函数显式挂载到window上，让Terser识别到该函数存在外部引用：

  // 你的函数定义
  function getUserStats() {
    // 函数逻辑
  }
  // 挂载到全局
  window.getUserStats = getUserStats;
  

• 调整Terser的toplevel配置
  如果你不需要清理顶层未引用的代码，可以将toplevel设为false，这样Terser不会主动移除顶层的函数定义：

  {
    compress: {
      drop_console: true,
      drop_debugger: false,
      dead_code: false,
    },
    mangle: {
      reserved: ["getUserStats"],
    },
    module: true,
    toplevel: false, // 修改这里
    keep_fnames: false
  }
  

• 改用模块导出+HTML模块引入
  如果不想依赖全局对象，可以将函数导出，同时在HTML中用模块方式引入脚本：

  // 导出函数
  export function getUserStats() {
    // 函数逻辑
  }
  

  HTML中：

  <script type="module">
    import { getUserStats } from './your-script.js';
    // 或者挂载到全局供其他代码调用
    window.getUserStats = getUserStats;
  </script>
  

• 检查前置打包工具的树摇逻辑
  如果你是通过Webpack、Rollup等工具调用Terser，要确保这些工具的树摇功能没有提前移除未导出的函数，可通过配置标记该函数为"副作用"或强制保留。

内容的提问来源于stack exchange，提问作者deekep