旧版create-react-app(v1.1.10)配置devtool=source-map不生成.map文件求助

针对你使用的create-react-app 1.1.10版本（未执行eject操作），以下两种方法可解决source map无法生成的问题：

方法一：通过环境变量直接开启 #

注意该版本无需带REACT_APP前缀，直接使用GENERATE_SOURCEMAP环境变量：

• 临时开启：执行构建命令时直接附加变量

GENERATE_SOURCEMAP=true npm run build

• 永久配置：在项目根目录创建.env.production文件，写入以下内容：

GENERATE_SOURCEMAP=true

之后正常执行npm run build即可生效。

方法二：借助react-app-rewired修改配置（无需eject） #

如果环境变量方式无效，可通过该工具覆盖默认Webpack配置：

1. 安装依赖包

npm install react-app-rewired --save-dev

2. 在项目根目录新建config-overrides.js文件，添加以下代码：

module.exports = function override(config, env) {
  if (env === 'production') {
    // 开启source map
    config.devtool = 'source-map';
    // 指定source map文件的输出路径与命名规则
    config.output.sourceMapFilename = 'static/js/[name].[chunkhash:8].map';
  }
  return config;
};

3. 修改package.json中的build脚本：

"scripts": {
  "build": "react-app-rewired build"
}

4. 执行npm run build，即可生成对应的source map文件。

验证配置是否生效 #

构建完成后，检查build/static/js目录下是否存在.map后缀的文件；同时打开build/index.html，查看打包后的JS文件末尾是否带有sourceMappingURL注释，存在则说明配置成功。

内容的提问来源于stack exchange，提问作者Carlos Jaime C. De Leon