create-react-app 架构的项目打包生产环境的代码如何关闭 sourcemap?

答案

简便的处理方法，

配置环境变量 GENERATE_SOURCEMAP=false。可以在打包的时候加入，如

GENERATE_SOURCEMAP=false npm run build

也可以直接设置环境变量然后再打包，如通过.env等文件，或者 ci 配置的 settings/ pipelines/ Secret variables 来设置。

解释

sourcemap 是什么？

按照字面量的理解就是源码映射。其作用是将发布的代码和源码关联起来，方便在浏览器或其他运行环境中调试。懂的人都知道，无需过分解释。

参考

代码的出处为 <rootDir>/config/webpack.config.prod.js，可以找到这样的一个变量 shouldUseSourceMap。

验证

如何校验 sourcemap 在打包中是否已经去掉成功了呢？每个人有自己的办法。

思考

关于 sourcemap 更好的处理方法？

sourcemap 直接暴露在生产环境中，有一些不雅和安全性上的考量，是否可以将 sourcemap 的路径映射到内网的环境中呢？这样，只有能够访问内网环境的自己人才能加载 sourcemap，便对 sourcemap 有一定的保护作用。

---