angular - 构建具有多个配置的应用程序

Question

Is it possible to combine common styles along with configuration specific styles? Or to be specific, build app with multiple configurations?

---

我有一个应用程序，它根据构建期间使用的配置使用不同的 Material 主题。这是应用的 angular.json 的 build 部分的样子:

"build": {
  "builder": "@angular-devkit/build-angular:browser",
    "options": {
        "outputPath": "dist/my-app",
        "index": "src/index.html",
        "main": "src/main.ts",
        "tsConfig": "src/tsconfig.app.json",
        "scripts": [ ],
        "styles": [
          // These are the common styles
          "src/styles.scss"
        ],
        "assets": [
          "src/assets",
          "src/favicon.ico"
        ]
      },
      "configurations": {
        "theme-one": {
          "styles": [                
            "src/styles/themes/material.theme-one.scss"
          ]
        },
        "theme-two": {
          "styles": [                
            "src/styles/themes/material.theme-two.scss"
          ]
        }
      }
    },

---

▶ Expected Behavior:

我想添加/组合在个别配置中指定的样式以及在中指定的样式 构建:选项。例如，使用以下命令:

ng build --configuration theme-one

上面的命令应该包括"src/styles.scss"和"src/styles/themes/material.theme-one.scss “。 theme-two 也一样。

▶ Current Behavior:

当前的行为是，当我指定配置时，该配置中的 styles 包括在内，但 build:options:styles 被忽略。

知道如何实现吗？

Answer 1

在与 Filipe Silva(来自 CLI 核心团队)讨论了您的问题后，目前没有可用的 API 来执行此操作。我建议您在 CLI 存储库中将此问题作为功能请求打开。

与此同时，实现此目的的一种方法是复制配置选项，如下所示:

"configurations": {
    "theme-one": {
      "styles": [   
        "src/styles.scss",          
        "src/styles/themes/material.theme-one.scss"
      ]
    },
    "theme-two": {
      "styles": [
        "src/styles.scss",                
        "src/styles/themes/material.theme-two.scss"
      ]
    }
  }

干杯。