如何解决React项目执行npm run build:prod时构建失败的问题

嘿，我一眼就看出问题所在了！你的错误日志里明确写着npm ERR! missing script: build，再看你的package.json配置——确实，你只定义了build:prod脚本，但这个脚本里调用了npm run build，而你的scripts里根本没有单独的build命令，npm找不到它当然会报错啦。

给你两个简单的解决方案，选哪个都行：

方案一：直接修改build:prod脚本 #

把build:prod的命令改成直接加载prod环境变量后执行React的构建命令，不需要依赖单独的build脚本：

"scripts": {
  "start": "env-cmd -f .env.dev react-scripts start",
  "build:prod": "env-cmd -f .env.prod react-scripts build",
  "test": "react-scripts test",
  "eject": "react-scripts eject"
}

这样修改后，运行npm run build:prod时，env-cmd会先加载.env.prod里的环境变量，然后直接执行react-scripts build完成生产环境构建。

方案二：添加单独的build基础脚本 #

如果以后需要复用基础的build命令，你可以先在scripts里添加一个通用的build脚本，再让build:prod调用它：

"scripts": {
  "start": "env-cmd -f .env.dev react-scripts start",
  "build": "react-scripts build",
  "build:prod": "env-cmd -f .env.prod npm run build",
  "test": "react-scripts test",
  "eject": "react-scripts eject"
}

这个方案的好处是，要是以后你需要调整build的基础逻辑，只改build这一个脚本就行，所有依赖它的环境构建命令都不用动。

修改完package.json之后，记得保存文件，然后重新运行npm run build:prod，应该就能顺利完成构建了。如果还是有问题，可以检查一下env-cmd是不是已经正确安装（不过你能运行start命令，应该是没问题的，实在不行就重新装一下：npm install env-cmd --save-dev）。

内容的提问来源于stack exchange，提问作者techstack