是否建议从 ReactJS 生成的构建中删除 .map 文件？

Question

我正在 ReactJS 中开发大型应用程序并且担心巨大的构建大小问题。

在 ReactJS 中生成构建（生产模式）后，我发现构建大小太大了，经过研究，我知道你可以删除源映射 文件（.地图）通过在 package.json 文件中进行以下配置。

 "postbuild": "rimraf build/**/*.map",

因此，我的构建大小减少了 80%，这让我非常高兴。

但是，我还是有一个疑问，上述是不是最好的解决方案？

Answer 1

Source Maps 有助于在浏览器中调试您的捆绑文件。它们在开发环境中很有用，但如果它们太重，通常最好不要将它们包含在生产环境中。

您可以在构建阶段本身禁用源映射生成。

如果您使用的是最新的 create-react-app，请在 webppack.config.prod 中更改此行

const shouldUseSourceMap = process.env.GENERATE_SOURCEMAP !== 'false';

至

const shouldUseSourceMap = false

并且您的产品构建文件将不包含源映射。

注意：您应该已经弹出您的 create-react-app 以访问您的 webpack 配置文件

Answer 2

我发现在商业现实中，在任何环境中拥有源地图比人们"fear it costs".

节省更多时间

归根结底就是这样。人们害怕它。

你到底在混淆什么？不好的做法？不安全的代码？不提供源地图不会让你在那里。

如果您想节省性能？它们仅在打开 devtools 时加载，此时......哦，你看你没有 sourcemaps 真遗憾，调试现在更加困难。

Answer 3

如果你来到这里并正在使用 webpack，只需在你的配置中将 devtool 设置为 false 以禁用 webpack（当前为 @5）生成 .map 文件。

module.exports = {
    devtool: false
}

除此之外对我没有任何作用，即使设置 mode: "production" 也不起作用。

Is that suggested to delete .map files from the build generated by ReactJS?