InertiaJS（Laravel+React+Vite）部署至Vercel问题咨询

• 确认项目结构与框架适配
  InertiaJS常搭配后端框架（如Laravel、Rails）或纯前端栈（Vue/React+Node），Vercel对不同结构的部署配置逻辑不同：

  • 若为Laravel+Inertia组合：需在vercel.json中指定构建命令为npm run build && php artisan inertia:manifest，同时在Vercel项目设置中添加APP_URL环境变量（值为Vercel分配的域名），并开启PHP运行时支持。
  • 若为纯前端Inertia项目（如React+Inertia）：将构建命令设为npm run build，输出目录设为dist或build（根据你的前端框架配置），同时检查inertia.js中的baseUrl是否正确指向API服务地址。

• 排查构建日志定位问题
  部署失败后优先查看Vercel的构建日志，高频错误场景包括：

  • 依赖安装失败：确认package.json中依赖版本兼容，可尝试删除node_modules和package-lock.json后重新提交代码，或临时在构建命令前追加npm install --force解决版本冲突。
  • 环境变量缺失：Vite项目需配置VITE_APP_URL，Create React App项目需配置REACT_APP_URL，这些变量要在Vercel项目的环境变量设置中添加。

• 配置路由重写避免单页应用404
  InertiaJS属于单页应用，需在vercel.json中添加路由重写规则：

  {
    "rewrites": [
      { "source": "/(.*)", "destination": "/index.html" }
    ]
  }
  

  若项目包含后端API路由，需额外配置API路径的转发规则，比如Laravel项目需确保api/*路径指向后端服务。

• 验证Inertia Manifest文件有效性
  部分后端框架会生成Inertia Manifest文件，比如Laravel项目的public/js/manifest.json，需确保该文件已提交至Git，或在构建命令中包含生成该文件的步骤。

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