javascript - webpack 和 terser 在缩小的输出中泄漏源文件名

Question

使用 Terser 缩小时，是否有办法防止源文件名传播到 webpack 输出？

示例

在我的缩小生产 React 应用程序生成生成的 .js 输出文件中，我仍然在输出中看到未损坏的源文件名。

示例摘录:

[...]
({"../js/dashboard/lib/MyApiClient.js":function(e,t,n){"use
strict";n.r(t),n.d(t,"default",function(){return c});var
o=n("../node_modules/axios/index.js"),r=n.n(o),
s=n("../node_modules/@sentry/browser/esm/index.js");
[...]

您可以在这里看到一些内容:

• 我的专有代码有某种名为 MyApiClient.js 的模块
• 我们正在使用 axios 和 Sentry

Webpack 配置

这是我们的生产 webpack 配置的相关部分:

  optimization: {
    minimize: true,
    minimizer: [
      new TerserPlugin({
        sourceMap: true,
        extractComments: false,
        terserOptions: {
          output: {
            comments: false,
          },
        },
      }),
    ],
  },

问题

我担心的是，这是泄露有关我们应用程序内部结构的信息，而且我还没有在堆栈中找到正确的位置(webpack 选项？terser 选项？)来阻止它.

虽然上面的例子是良性的，当然，再多的修改也不会导致代码无法对功能进行逆向工程，但我不想让其他人太容易理解应用程序已构建以及它可能隐藏了哪些功能。

谢谢!

Answer 1

这与 webpack 的 optimization.namedModules 有关默认情况下应为 false 的选项，也许它已在您的配置中启用。

// webpack.config.js
module.exports = {
  //...
  optimization: {
    namedModules: false
  }
};