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 有一定的保护作用。


原文链接:segmentfault.com

上一篇:vue 之 render函数
下一篇:揭秘 Vite 的原理

相关推荐

官方社区

扫码加入 JavaScript 社区