如何运行 Angular 构建结果（dist 文件夹、artefact）？

Question

我使用以下方法对我的应用程序进行了 Angular 构建：

$ ng build

并将结果上传到我的远程服务器上：

我还在服务器上安装了适当的节点版本和 Angular CLI。当我尝试运行应用程序时

$ ng serve

我看到：

Error: This command is not available when running the Angular CLI outside a workspace.

我的目的是使用 Nginx 作为代理服务器来运行前端和后端。也许我不应该使用 Angular CLI？我的应用程序中也有 SSR。我只是想将所有内部 Node.js 厨房（包括 SSR 魔法）留给 Node.js，只添加一个 Nginx 反向代理。 请帮我弄清楚。

这是我的

angular.json

构建部分：

        "build": {
          "builder": "@angular-devkit/build-angular:application",
          "options": {
            "outputPath": "dist/market-service",
            "index": "src/index.html",
            "browser": "src/main.ts",
            "polyfills": [
              "zone.js"
            ],
            "tsConfig": "tsconfig.app.json",
            "assets": [
              "src/favicon.ico",
              "src/assets"
            ],
            "styles": [
              "node_modules/bootstrap/dist/css/bootstrap.min.css",
              "src/styles.css",
              "src/assets/header.css",
              "src/assets/buttons.css"
            ],
            "scripts": [],
            "server": "src/main.server.ts",
            "prerender": true,
            "ssr": {
              "entry": "server.ts"
            }
          },
          "configurations": {
            "production": {
              "budgets": [
                {
                  "type": "initial",
                  "maximumWarning": "500kb",
                  "maximumError": "1mb"
                },
                {
                  "type": "anyComponentStyle",
                  "maximumWarning": "2kb",
                  "maximumError": "4kb"
                }
              ],
              "outputHashing": "all"
            },
            "development": {
              "optimization": false,
              "extractLicenses": false,
              "sourceMap": true,
              "fileReplacements": [
                {
                  "replace": "src/environments/environment.ts",
                  "with": "src/environments/environment.development.ts"
                }
              ]
            }
          },
          "defaultConfiguration": "production"
        }

更新

我尝试使用node.js直接运行应用程序：

没有效果。

Answer 1

使用以下内容构建您的项目

$ ng build --configuration production && ng run market-service:server:production

使用

ng build

您可以构建客户端项目。为了构建和部署 SSR 端，请运行

ng run market-service:server

，这会导致错误，因为构建器

server

可能未定义。 为此，添加以下代码：

角度.json

{
  ...
  "projects": {
    "rf_public": {
      ...
      "architect": {
        "build": {...},
        "serve": {...},
        "extract-i18n": {...},
        "test": {...},
        // From here <-----
        "server": {
          "builder": "@angular-devkit/build-angular:server",
          "options": {
            "outputPath": "dist/rf_public/server",
            "main": "server.ts",
            "tsConfig": "tsconfig.server.json",
            "sourceMap": true,
            "optimization": false
          },
          "configurations": {
            "production": {
              "outputHashing": "media",
              "sourceMap": false,
              "optimization": true
            }
          }
        },
        // To here <-----

此后，上传整个 dist/ 文件夹并在远程服务器中运行以下命令：

$ node dist/market-service/server/main.js

---

https://angular.io/guide/workspace-config