Question

我正在使用 Angular 5.2 ，我需要像使用ng build --prod一样进行捆绑，但是要使用不同的环境

我尝试过：

ng build --env=qa --aot --vendorChunk --common-chunk --output-hashing=bundles

但是它给我的捆绑效果不如--prod

它同时生成.js和.js.map文件

main.66dc6fba707fe2f3314c.bundle.js
main.66dc6fba707fe2f3314c.bundle.js.map

我应该使用哪些选项在--prod上获得相同的结果，但环境不同？

Answer 1

在angular 6中，您可以在angular.json中创建多个环境

查找配置，并在其中创建具有各种设置的多个环境，您可以在这里https://github.com/angular/angular-cli/wiki/angular-cli

示例

"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
  },
  "staging": {
    "fileReplacements": [
      {
        "replace": "src/environments/environment.ts",
        "with": "src/environments/environment.staging.ts"
      }
    ],
    "optimization": true,
    "outputHashing": "all",
    "sourceMap": false,
    "extractCss": true,
    "namedChunks": false,
    "aot": true,
    "extractLicenses": true,
    "vendorChunk": false,
    "buildOptimizer": true
  }
}

如您所见，我创建了另一个环境名称分段

虚拟的angular.json文件为https://api.myjson.com/bins/12k70w

要在特定环境下运行应用程序，只需使用

ng build --configuration=staging

我还已经在名为environment.staging.ts的环境中创建了一个文件

export const environment = {
    production: true,
    APIEndpoint: "http://0.0.0.0:8080/api"
};

Answer 2

在创建环境文件时，我们需要将production设置为true，这将默认在main.ts中启用带有AOT的Production Build。

environment.stage.ts

export const environment = {
  production: true
};

main.ts

if (environment.production) {
  enableProdMode();
}


Cmd: ng build --prod --env=stage

如何在不同的环境中构建角度项目

2 个答案: