使用Create React App创建的单页应用生产环境下默认会使用sourceMap文件，这些文件一般很大，最好不要将它们部署到服务器上。当然，我们可以手动删除已经输出的文件，高级一点还可以使用一个node程序来批量删除。但能不能简单一点，通过webpack不输出sourceMap文件呢？
Create React App这个工具链是官方推荐的的最佳方式，不过默认下它隐藏了webpack，无法直接修改配置，因此我们想自定义一些配置比较麻烦。目前能自定义的方式主要有：
一、使用eject
在package.json中很容易找到该命令，运行该命令会还原react-scripts隐藏的webpack配置，通过webpack配置文件我们就可以随心所欲地自定义了。注意，该过程是不可以逆的，会生成很多工程文件。小心使用为妙！
二、使用config-overrides.js
这是一种通过覆盖webpack原有默认配置的方式一定来自定义的方式。
1. 安装依赖
npm i -D react-app-rewired customize-cra
2. 修改 package.json脚本
"scripts": {
"start": "react-app-rewired start",
"build": "react-app-rewired build",
"test": "react-scripts test --env=jsdom"
...
}
3. 设置config-overrides.js
比如我们要在生产环境不输出sourceMap文件，可以在项目的根目录下新建config-overrides.js，然后这样定义：
const { override } = require('customize-cra');
module.exports = override(
(() => (config, env) => {
if (env === 'production') {
config.output.publicPath = '';
config.devtool = false;
}
return config;
})()
)
运行npm run build后会发现，确实不会输出js的sourceMap文件，但css的sourceMap文件依然照输不误。尝试使用customize-cra插件的其它方法也无功而返。直到我仔细阅读了Create React App文档，最终找到了办法。
三、使用.env
项目的根目录下新建.env.production，该文件只对生产环境有效，然后这样定义：
GENERATE_SOURCEMAP = false
运行npm run build后，js/css的sourceMap文件都不会输出。一切都安静了，真好！
