将React应用推送至Heroku失败：remote rejected main->main(pre-receive hook declined)

1. 优先查看Heroku构建日志 #

这是定位问题最直接的方式，日志会明确给出构建失败的具体原因：

• 命令行查看：

  heroku logs --tail
  

• 或登录Heroku后台，进入应用sapient-origin-alpha，通过More > View logs查看完整构建过程。

2. 检查package.json关键配置 #

确认build脚本存在 #

确保scripts字段包含正确的构建命令（以create-react-app为例）：

"scripts": {
  "start": "react-scripts start",
  "build": "react-scripts build",
  "test": "react-scripts test",
  "eject": "react-scripts eject"
}

自定义React项目需保证build脚本能将生产环境静态文件生成到build目录。

指定Node/npm版本 #

在package.json中添加engines字段，匹配本地开发环境版本（避免版本兼容问题）：

"engines": {
  "node": "18.x",
  "npm": "9.x"
}

可通过node -v和npm -v查看本地版本后对应填写。

3. 验证Git远程仓库关联 #

确认本地Git的Heroku远程仓库指向正确应用：

git remote -v

输出应包含：

heroku  https://git.heroku.com/sapient-origin-alpha.git (fetch)
heroku  https://git.heroku.com/sapient-origin-alpha.git (push)

若指向错误，重新执行关联命令：

git remote rm heroku
heroku git:remote -a sapient-origin-alpha

4. 清理Heroku构建缓存 #

缓存残留可能导致构建异常，执行以下命令清理：

heroku builds:cache:purge

清理完成后重新推送代码：

git push heroku main

5. 检查环境变量配置 #

若React应用依赖REACT_APP_*开头的环境变量，需在Heroku上配置：

• 命令行设置：

  heroku config:set REACT_APP_YOUR_VAR=value
  

• 或在Heroku后台应用的Settings > Config Vars中添加。

6. 确认Git提交内容 #

• 确保.gitignore文件包含/build（无需提交本地构建的静态文件，Heroku会自行构建）
• 确认package.json、package-lock.json或yarn.lock等核心文件已提交

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