Nuxt SSR拆分admin/client/server目录的项目如何部署到Heroku？

针对admin、client、server三个子目录各有独立package.json和nuxt配置的项目，可通过根目录聚合脚本的方式适配Heroku部署要求，无需调整原有子目录的业务逻辑配置，具体操作如下：

1. 新增根目录package.json #

在项目根目录创建package.json，统一管理三个子目录的依赖安装、构建、启动逻辑，配置示例如下：

{
  "name": "amazon-clone-root",
  "version": "1.0.0",
  "engines": {
    "node": "14.x"
  },
  "scripts": {
    "install-all": "npm install --prefix client && npm install --prefix server && npm install --prefix admin",
    "build": "npm run build --prefix client && npm run build --prefix server && npm run build --prefix admin",
    "start": "npm run start --prefix client",
    "heroku-postbuild": "npm run install-all && npm run build"
  }
}

若需要同时启动admin、server服务，可安装concurrently依赖修改start脚本：start: "concurrently \"npm run start --prefix client\" \"npm run start --prefix server\" \"npm run start --prefix admin\""，注意给admin、server配置不同于client的端口，避免冲突。

2. 调整子目录Nuxt配置 #

分别在三个子目录的nuxt.config.js中添加服务监听配置，适配Heroku环境变量：

export default {
  // 其余原有配置保持不变
  server: {
    host: process.env.HOST || '0.0.0.0',
    port: process.env.PORT || 3000 // admin可改为3001，server改为3002
  }
}

3. 确认Procfile配置 #

原有Procfile的web: npm start无需修改，Heroku会自动执行该启动命令拉起主web服务。

4. 重新部署 #

• 将新增的根目录package.json、修改后的配置文件提交到Git仓库
• 清理Heroku构建缓存（可选，避免旧缓存影响部署）：heroku builds:cache:purge -a 你的Heroku应用名称
• 执行推送部署：git push heroku main（若你的主分支为master，替换为master即可）

注意事项 #

• 三个子目录所需的所有环境变量，都需要通过heroku config:set命令或者Heroku后台配置完成
• 已配置的NPM_CONFIG_PRODUCTION=true会跳过devDependencies安装，若子目录的构建脚本依赖devDependencies中的包，可将对应依赖转移到dependencies字段，或将该环境变量改为false

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