Heroku部署Vite前端项目报错H10: vite: not found如何解决

• Heroku 生产环境默认执行 npm install --production，仅安装 dependencies 目录下的依赖，你将 vite 放在了 devDependencies 中，部署时不会被安装，自然找不到vite可执行文件
• 生产部署不应该使用 Vite 自带的开发服务器，你当前设置的启动命令为 npm run dev，该命令仅适用于本地开发调试，不具备生产环境所需的稳定性和性能，也不符合静态资源部署的逻辑。

1. 安装静态服务工具 serve 到生产依赖，用于部署启动时访问打包后的静态资源，执行命令：

npm install serve

2. 修改 package.json 中的 scripts 配置，新增生产启动命令：

{
  "scripts": {
    "dev": "vite",
    "build": "vite build",
    "start": "serve -s dist -p $PORT"
  }
}

说明：$PORT 是 Heroku 动态分配的服务端口，必须使用该变量不能写死端口；-s 参数开启单页应用模式，所有请求会自动 fallback 到 index.html，适配前端路由规则。
3. 选择以下任意一种方案解决build阶段找不到vite的问题：

• 方案A：将 devDependencies 中的 @vitejs/plugin-react-refresh 和 vite 全部移动到 dependencies 下，Heroku 安装时会自动安装这两个依赖，正常执行build命令
• 方案B：在 Heroku 后台的应用配置页添加环境变量 NPM_CONFIG_PRODUCTION=false，npm 安装时会安装所有依赖包括 devDependencies，无需调整依赖的存放位置

4. 提交修改后的 package.json 和 package-lock.json 代码，重新推送到 Heroku 即可正常部署。

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