有没有办法在 angular.json 中扩展配置?

问题描述

在构建我的 Angular 6 应用程序时，我需要同时指定两件事:

While building my Angular 6 application, I need to specify 2 things at once:

• 如果是生产版或开发版
• 我使用的语言环境

在我的 angular.json 中，我有:

"build": {
  ...
  "configurations": {
    "production": {
      "fileReplacements": [
        {
          "replace": "src/environments/environment.ts",
          "with": "src/environments/environment.prod.ts"
        }
      ],
      "optimization": true,
      "outputHashing": "all",
      "sourceMap": false,
      "extractCss": true,
      "namedChunks": false,
      "aot": true,
      "extractLicenses": true,
      "vendorChunk": false,
      "buildOptimizer": true
    },
    "pl": {
      "fileReplacements": [
        {
          "replace": "src/assets/i18n/translations.json",
          "with": "src/assets/i18n/pl.json"
        }
      ]
    },
    "en": {
      "fileReplacements": [
        {
          "replace": "src/assets/i18n/translations.json",
          "with": "src/assets/i18n/en.json"
        }
      ]
    }
  }
}

但是当我在做 ng build --configuration=en --configuration=production 我收到一个错误 Configuration 'en,production' could not be found.我理解这意味着您一次只能指定 1 个配置.

But when I'm doing ng build --configuration=en --configuration=production I'm getting an error Configuration 'en,production' could not be found. I understand it means you can specify only 1 configuration at a time.

这意味着我需要创建单独的 en、pl、productionEn、productionPl 配置.虽然不是最干净的模式，但我可以接受.

This means I need to create separate en, pl, productionEn, productionPl configurations. Though not the cleanest pattern, I can live with that.

"build": {
  ...
  "configurations": {
    "production": {
      "fileReplacements": [
        {
          "replace": "src/environments/environment.ts",
          "with": "src/environments/environment.prod.ts"
        }
      ],
      "optimization": true,
      "outputHashing": "all",
      "sourceMap": false,
      "extractCss": true,
      "namedChunks": false,
      "aot": true,
      "extractLicenses": true,
      "vendorChunk": false,
      "buildOptimizer": true
    },
    "pl": {
      "fileReplacements": [
        {
          "replace": "src/assets/i18n/translations.json",
          "with": "src/assets/i18n/pl.json"
        }
      ]
    },
    "en": {
      "fileReplacements": [
        {
          "replace": "src/assets/i18n/translations.json",
          "with": "src/assets/i18n/en.json"
        }
      ]
    },
    "productionPl": {
      "fileReplacements": [
        {
          "replace": "src/environments/environment.ts",
          "with": "src/environments/environment.prod.ts"
        },
        {
          "replace": "src/assets/i18n/translations.json",
          "with": "src/assets/i18n/pl.json"
        }
      ],
      "optimization": true,
      "outputHashing": "all",
      "sourceMap": false,
      "extractCss": true,
      "namedChunks": false,
      "aot": true,
      "extractLicenses": true,
      "vendorChunk": false,
      "buildOptimizer": true
    },
    "productionEn": {
      "fileReplacements": [
        {
          "replace": "src/environments/environment.ts",
          "with": "src/environments/environment.prod.ts"
        },
        {
          "replace": "src/assets/i18n/translations.json",
          "with": "src/assets/i18n/en.json"
        }
      ],
      "optimization": true,
      "outputHashing": "all",
      "sourceMap": false,
      "extractCss": true,
      "namedChunks": false,
      "aot": true,
      "extractLicenses": true,
      "vendorChunk": false,
      "buildOptimizer": true
    }
  }
}

但我无法忍受的是将整个 production 配置内容复制并粘贴到 productionEn 和 productionPl 中.如果我添加更多的语言环境，或者我想在构建过程中指定的第三个独立方面，这种模式将成为维护的噩梦.不幸的是，这似乎是 Angular 团队在他们的文档中推荐的模式.

But what I can't live with is copying and pasting the whole production configuration contents into productionEn and productionPl. If I add even more locales, or some third separate aspect that I'd like to specify during build, this pattern would become a total nightmare to maintain. Unfortunately it seem it's the pattern that Angular team recommends in their documentation.

有没有办法告诉 Angular CLI productionEn 扩展 production，这样就不会多次重复相同的配置代码?类似于下面的代码:

Is there a way to tell Angular CLI that productionEn extends production, so to not duplicate the same configuration code multiple times? Something like the code below:

"build": {
  ...
  "configurations": {
    "production": {
      (...)
    },
    "pl": {
      "extends": "production",
      (...)
    },
    "en": {
      "extends": "production",
      (...)
    }
  }
}

推荐答案

终于有办法了，在命令行中指定多个配置:

There finally is a way to do it, specifying multiple configurations in the command line:

ng build --configuration=en,production

Angular repo 中的相关问题

注意 --prod 标志在你使用 --configuration 时会被忽略(所以你需要显式地将 production 添加到配置列表中).

Note that --prod flag is ignored when you use --configuration (so you need to add production to the configuration list explicitly).

Angular 文档，用于--configuration=configuration:

一个命名的构建目标，如配置"中指定的那样angular.json 的部分.每个命名的目标都伴随着该目标的选项默认配置.明确设置此项会覆盖--prod"标志

别名:-c

这篇关于有没有办法在 angular.json 中扩展配置?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！