如何在不同的环境中构建角度项目 [英] how to build angular project with different environment

问题描述

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

I am using Angular 5.2 and I need to bundle like it does with ng build --prod but with the different environment

我尝试过:

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

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

but it does not give me the same bundling as i see with --prod

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

it generates both a .js and .js.map file

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

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

What options should I use to get me the same result at --prod but with a different environment?

推荐答案

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

In angular 6 you can create multiple environments in angular.json

查找配置，并在其中查找可以使用各种设置创建多个环境的信息，这些设置可以在此处找到

Find configuration and inside that you can create multiple environment with various settings which you can find from here 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
  }
}

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

As you can see i have created an another environment name staging

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

The Dummy angular.json file is https://api.myjson.com/bins/12k70w

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

To run the application with specific environment just use

ng build --configuration=staging

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

I have also created a file in environment called environment.staging.ts

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

这篇关于如何在不同的环境中构建角度项目的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！