编程技术记录

世界你好!

用create-react-app 脚手架创建的react项目,使用npm run build打包后,默认会产生source-map文件,通常项目上线后这种文件是不必要的。

现在需要配置以关闭这种文件的产生。

打开项目的package.json文件,找到下面类似的配置

"scripts": {
    "analyze": "source-map-explorer 'build/static/js/*.js'",
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },

可以看到build命令执行的脚本是react-scripts build,然后打开
node_modules/react-scripts/config/webpack.config.js文件。

一般情况下,定位到这,基本就知道了怎么关闭source-map文件产生–搜索shouldUseSourceMap,将其置为false就行了。

如果仔细查看shouldUseSourceMap定义

const shouldUseSourceMap = process.env.GENERATE_SOURCEMAP !== 'false';

会发现shouldUseSourceMap和process.env.GENERATE_SOURCEMAP环境变量有关,那么在不修改webpack.config.js文件的情况,其实还可以修改环境变量。( 环境变量修改参考https://139.155.43.7/2019/10/15/create-react-app-%e8%87%aa%e5%ae%9a%e4%b9%89%e7%8e%af%e5%a2%83%e5%8f%98%e9%87%8f/ )

在项目目录下创建.env文件,添加内容

GENERATE_SOURCEMAP=false

然后重新执行npm run build,这时应不会产生source-map文件

© Beli. All Rights Reserved.