我有一个关于webpack的基本问题,并且我可以使用帮助进行反应(围绕代码混淆/ uglification)。
我正在使用create-react-app
我的应用程序,它似乎创建了一个捆绑的生产(生产后yarn build
)。
在该文件中,似乎所有内容都放入main.JS文件和main.CSS文件等。我使用“firebase deploy”(在我的情况下)推送这个。我想让我的代码变得丑陋,并且不会被任何开发人员完全读取。
但是,当我在Chrome中查看我的应用时,它不显示main.JS或任何其他捆绑文件。它只显示每个单独的文件以及我编写的代码。知道为什么会这样吗?为什么不在chrome中的'sources'选项卡下显示uglified组合的main.js文件?这与源地图有关吗?
发布于 2018-08-29 14:49:14
React在构建期间缩小代码并生成源映射。JS最终被认为是缩小产品的副产品,而不是因为保密。这样,最终用户能够比不缩小脚本更快地加载脚本,并且当您(或他们)打开开发人员工具时,您(以及其他所有人)可以浏览原始代码。
如果您build/static/js
在构建后查看目录,则有成对.js
和.map
文件。JS文件随您的网站一起加载,并且.map
在打开Developer Tools时按需加载文件。
要禁用源代码生成,请在GENERATE_SOURCEMAP
环境变量设置为的情况下运行构建false
。
GENERATE_SOURCEMAP=false npm run build
要么
GENERATE_SOURCEMAP=false yarn build
或者将其作为build
脚本的一部分package.json
{
…
"scripts": {
…
- "build": "react-scripts build"
+ "build": "GENERATE_SOURCEMAP=false react-scripts build"
}
}
如果省略.map
源代码生成,文件将不会在生产中结束,并且原始源代码将不会供任何人(包括您)使用。
发布于 2018-08-29 16:30:23
有一种更好的方法可以确保不包含源映射。在项目根文件夹中创建.env文件并添加GENERATE_SOURCEMAP=false
。您将在没有源地图的情况下构建。
https://stackoverflow.com/questions/-100005026
复制相似问题