使用 2 package.json 个文件在 Heroku 上部署时出现问题

Problem with deployment on Heroku with 2 package.json files

我正在尝试在 Heroku 上部署我的应用程序,有 2 个 package.json 个文件。

首先是前端:

{
  "name": "quiz",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "npm start --prefix server",
    "build": "ng build",
    "watch": "ng build --watch --configuration development",
    "test": "ng test",
    "heroku-postbuild": "npm run build --prefix server && ng build --prod"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "~12.0.2",
    "@angular/common": "~12.0.2",
    "@angular/compiler": "~12.0.2",
    "@angular/core": "~12.0.2",
    "@angular/forms": "~12.0.2",
    "@angular/platform-browser": "~12.0.2",
    "@angular/platform-browser-dynamic": "~12.0.2",
    "@angular/router": "~12.0.2",
    "rxjs": "~6.6.0",
    "tslib": "^2.1.0",
    "zone.js": "~0.11.4"
  },
  "devDependencies": {
    "@types/express": "^4.17.13",
    "@angular-devkit/build-angular": "~12.0.2",
    "@angular/cli": "~12.0.2",
    "@angular/compiler-cli": "~12.0.2",
    "@types/jasmine": "~3.6.0",
    "@types/node": "^12.11.1",
    "jasmine-core": "~3.8.0",
    "karma": "~6.3.0",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage": "~2.0.3",
    "karma-jasmine": "~4.0.0",
    "karma-jasmine-html-reporter": "^1.7.0",
    "typescript": "~4.2.3"
  },
  "engines": {
    "node": "16.x",
    "npm": "7.x"
  }
}

第二个是后端:

{
  "name": "server",
  "version": "1.0.0",
  "description": "",
  "main": "dist/index",
  "scripts": {
    "start": "node ./dist/server/index.js",
    "dev": "nodemon index.ts",
    "build": "tsc -p ."
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "@types/express": "^4.17.13",
    "@types/node": "^16.6.1",
    "nodemon": "^2.0.12",
    "ts-node": "^10.2.1",
    "typescript": "^4.3.5"
  },
  "dependencies": {
    "express": "^4.17.1",
    "zone.js": "^0.11.4"
  },
  "engines": {
    "node": "16.x",
    "npm": "7.x"
  }
}

因为我的 package.json 首先启动并触发 /server/package.json - 首先我尝试构建后端,在主 package.json 文件中使用“heroku-postbuild”命令然后这个命令构建 Angular app.

但是在 Heroku 运行s“启动”命令之后它显示了这样的错误:

Error: Cannot find module 'express'
2021-09-18T17:16:28.140193+00:00 app[web.1]: Require stack:
2021-09-18T17:16:28.140194+00:00 app[web.1]: - /app/server/dist/server/config/express.js
2021-09-18T17:16:28.140194+00:00 app[web.1]: - /app/server/dist/server/index.js
2021-09-18T17:16:28.140199+00:00 app[web.1]: at Function.Module._resolveFilename (node:internal/modules/cjs/loader:933:15)
2021-09-18T17:16:28.140200+00:00 app[web.1]: at Function.Module._load (node:internal/modules/cjs/loader:778:27)
2021-09-18T17:16:28.140200+00:00 app[web.1]: at Module.require (node:internal/modules/cjs/loader:1005:19)
2021-09-18T17:16:28.140200+00:00 app[web.1]: at require (node:internal/modules/cjs/helpers:94:18)
2021-09-18T17:16:28.140201+00:00 app[web.1]: at Object.<anonymous> (/app/server/dist/server/config/express.js:6:33)
2021-09-18T17:16:28.140201+00:00 app[web.1]: at Module._compile (node:internal/modules/cjs/loader:1101:14)
2021-09-18T17:16:28.140202+00:00 app[web.1]: at Object.Module._extensions..js (node:internal/modules/cjs/loader:1153:10)
2021-09-18T17:16:28.140202+00:00 app[web.1]: at Module.load (node:internal/modules/cjs/loader:981:32)
2021-09-18T17:16:28.140202+00:00 app[web.1]: at Function.Module._load (node:internal/modules/cjs/loader:822:12)
2021-09-18T17:16:28.140202+00:00 app[web.1]: at Module.require (node:internal/modules/cjs/loader:1005:19) {
2021-09-18T17:16:28.140203+00:00 app[web.1]: code: 'MODULE_NOT_FOUND',
2021-09-18T17:16:28.140204+00:00 app[web.1]: requireStack: [
2021-09-18T17:16:28.140204+00:00 app[web.1]: '/app/server/dist/server/config/express.js',
2021-09-18T17:16:28.140204+00:00 app[web.1]: '/app/server/dist/server/index.js'
2021-09-18T17:16:28.140205+00:00 app[web.1]: ]
2021-09-18T17:16:28.140205+00:00 app[web.1]: }

当我在本地 运行 所有这些命令时 - 它有效。

我通过将“express”移动到我的主 package.json 文件中解决了这个问题,但这不是我想要实现的。我想要 2 个单独的 json 文件,这样我就可以轻松处理每个后端和前端的已安装模块。

我做错了什么?

所以问题实际上是我需要在服务器和前端文件夹中执行 npm install

Heroku 有一个特殊命令 'heroku-prebuild' 可以帮助准备要构建的每个文件夹。

我创建了这样的命令:

 "heroku-prebuild": "npm install --prefix server && npm install",
 "heroku-postbuild": "npm run build --prefix server && ng build --prod"

首先,Heroku 运行“heroku-prebuild”,为前端和后端安装所有 npm 模块,然后运行“heroku-postbuild”,构建前端和后端 dist 文件夹。

之后它运行 "start": "npm start --prefix server" 并且一切正常。