基于Vite的React项目部署Heroku Stack 22遇404错误求助

• 修正nginx.conf.erb的root路径
  Heroku应用的所有文件默认存放在/app目录下，你配置的root /dist;是错误的绝对路径，需要改为指向应用内的dist文件夹：

root /app/dist;

同时确保配置中包含索引文件指定：

index index.html index.htm;

• 确保Heroku构建阶段自动生成dist文件夹
  不要依赖本地预生成的dist（若.gitignore排除了该目录则不会被提交），在package.json中配置正确的build脚本，让Heroku自动执行构建：

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

Heroku会自动触发npm run build（或yarn build，取决于你的包管理器）生成dist目录。

• 调整static.json配置
  nginx buildpack会读取static.json，但需避免配置冲突。将root改为dist（无需前缀./），同时添加单页应用路由配置，避免前端路由404：

{
  "root": "dist",
  "routes": {
    "/**": "index.html"
  }
}

• 检查Procfile启动命令
  部分版本的nginx buildpack启动脚本为start-nginx而非start-nginx-solo，尝试修改Procfile：

web: bin/start-nginx

• 通过Heroku日志定位问题
  执行命令查看实时日志，nginx的错误日志会明确显示文件查找失败的具体路径，帮助精准排查：

heroku logs --tail

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