十、angular6-配置开发环境、测试环境和生产环境，动态读取proxy.config.json

1.在environments文件夹中添加各环境的文件（st和uat为测试环境，名字可以随便取）

2. 配置各文件的参数

environment.prod.ts，production: true表示是生产环境

export const environment = {
  production: true,
  url: 'api/pro'
};

 environment.st.ts

export const environment = {
  production: false,
  url: 'api/st'
};

3.修改angular.json

(1)projects-build-configurations,添加st和uat

"st": {
              "fileReplacements": [
                {
                  "replace": "src/environments/environment.ts",
                  "with": "src/environments/environment.st.ts"
                }
              ],
              "optimization": true,
              "outputHashing": "all",
              "sourceMap": false,
              "extractCss": true,
              "namedChunks": false,
              "extractLicenses": true,
              "vendorChunk": false,
              "buildOptimizer": true,
              "budgets": [
                {
                  "type": "initial",
                  "maximumWarning": "2mb",
                  "maximumError": "5mb"
                },
                {
                  "type": "anyComponentStyle",
                  "maximumWarning": "6kb",
                  "maximumError": "10kb"
                }
              ]
            },

不同的地方就是"with": "src/environments/environment.st.ts"， 分别为prod,st,uat

(2)修改serve-configurations

 "configurations": {
            "production": {
              "browserTarget": "angular6-fundamentals:build:production"
            },
            "st": {
              "browserTarget": "angular6-fundamentals:build:st"
            },
            "uat": {
              "browserTarget": "angular6-fundamentals:uat:st"
            }
          }

4.如果是跨域的配置要动态读取配置的接口地址

（1）proxy.config.json

{
  "/api/dev": {
    "target": "http://localhost:8080",
    "secure": false,
    "logLevel": "debug",
    "changeOrigin": true,
    "pathRewrite": {
      "^/api/dev": ""
    }
  },
  "/api/st": {
    "target": "http://st:8080",
    "secure": false,
    "logLevel": "info",
    "changeOrigin": true,
    "pathRewrite": {
      "^/api/st": ""
    }
  },
  "/api/uat": {
    "target": "http://uat:8080",
    "secure": false,
    "logLevel": "info",
    "changeOrigin": true,
    "pathRewrite": {
      "^/api/uat": ""
    }
  },
  "/api/pro": {
    "target": "http://pro:8080",
    "secure": false,
    "logLevel": "error",
    "changeOrigin": true,
    "pathRewrite": {
      "^/api/pro": ""
    }
  }
}

 （2）接口服务中引入配置环境的js

import {environment} from "src/environments/environment";

  /**
   * get请求
   * @param info
   */
  status(info: Object): any {
    alert(environment.url);
    //return this.http.get("/api/API/Status");
    return this.http.get(environment.url + "/API/Status");
  }

（3）如果要启动st测试环境，ng serve -c st