Create-react-app部署至Heroku后未启用生产构建问题求助

我之前也踩过这个坑！别着急，咱们一步步排查解决：

1. 检查你的package.json脚本配置 #

这是最常见的问题——Heroku会根据start脚本启动应用，如果你的start还是默认的react-scripts start，那不管NODE_ENV设成啥，它都会跑开发模式。

正确的配置应该是：

• 保留build脚本（create-react-app默认就有）：

  "scripts": {
    "build": "react-scripts build",
    // ...其他脚本
  }
  

• 把start脚本改成生产环境的静态文件服务，比如用serve包（需要先安装它）：

  "scripts": {
    "start": "serve -s build",
    "build": "react-scripts build",
    "dev": "react-scripts start" // 可以保留这个用于本地开发
  }
  

  安装serve的命令：

  npm install serve --save
  

  （或者你也可以用express写个简单的静态服务器，但serve是最省事的选择）

2. 确认NODE_ENV确实生效 #

虽然你说已经设置了，但咱们再验证一下：

• 打开Heroku控制台，运行命令：

  heroku config:get NODE_ENV
  

  确保返回的是production。如果不是，重新设置：

  heroku config:set NODE_ENV=production
  

3. 检查react-scripts的依赖位置 #

react-scripts必须放在dependencies里，而不是devDependencies。因为Heroku在生产环境默认不会安装devDependencies，如果react-scripts在dev依赖里，build命令会失效，导致无法生成生产构建。

打开你的package.json，确保看到：

"dependencies": {
  "react-scripts": "^5.0.1",
  // ...其他依赖
}

4. 触发Heroku重新构建 #

有时候修改配置后，Heroku不会自动重新执行build流程。你可以通过空提交来强制触发：

git commit --allow-empty -m "Force Heroku rebuild"
git push heroku main

5. 查看Heroku日志排查问题 #

如果还是没解决，查看Heroku的构建日志，看看build阶段有没有报错：

heroku logs --tail

重点关注build步骤的输出，确认是否成功生成了build文件夹，以及NODE_ENV在build时是否被设为production。

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