angular 多端打包

一、在environments文件夾裏新建三個文件：

//生產環境
environment.prod.ts：
export const environment = {
  production: true,

    baseUrl:''

  url2 : 'http://xxx',
  url3 : 'http://xxx',
};
//測試環境
environment.test.ts：
export const environment = {
  production: false,

    baseUrl:'/test'

  url2 : 'http://xxx',
  url3 : 'http://xxx'
};
//本地環境
environment.ts：
export const environment = {
  production: false,
  url  : 'http://xxx',
  url2 : 'http://xxx',
  url3 : 'http://xxx',
};

二、重點是第二步（有別於Angular4）：
找到angular.json文件
找到 projects - architect - build - configurations 配置以下：

"production": {
              "optimization": true,
              "outputHashing": "all",
              "sourceMap": false,
              "extractCss": true,
              "namedChunks": false,
              "aot": true,
              "extractLicenses": true,
              "vendorChunk": false,
              "buildOptimizer": true,
              "fileReplacements": [
                {
                  "replace": "src/environments/environment.ts",
                  "with": "src/environments/environment.prod.ts"
                }
              ]
            },
            "test": {
              "optimization": true,
              "outputHashing": "all",
              "sourceMap": false,
              "extractCss": true,
              "namedChunks": false,
              "aot": true,
              "extractLicenses": true,
              "vendorChunk": false,
              "buildOptimizer": true,
              "fileReplacements": [
                {
                  "replace": "src/environments/environment.ts",
                  "with": "src/environments/environment.test.ts"
                }
              ]
            }

三、在接口服務裏引入

 import {environment} from '../environments/environment';
   url = environment.url;
   url2 = environment.url2;
   url3 = environment.url3;

     let baseUrl=environment.baseUrl;

 

    getDetailGeneral(type,id,isYestday):Observable<any>{

      return this.http.get(`${baseUrl}/risk/getAllListByType?type=${type}&id=${id}&dateTimeYes=${isYestday}`);

    }

四、package.json 配置裏修改：

"scripts": {
    "ng": "ng",
    "start": "ng serve --host 192.168.1.187",
    "build": "ng build --prod --configuration=production",
    "buildTest": "ng build --prod --configuration=test",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },

5.test 爲先後端分離的代理  新建proxy.conf.json   內容爲如下代碼 放在和package.json同級目錄下   

{
    "/test": {
        "target": "http://172.21.1.239:8180", 
        "secure": false,
        "changeOrigin": true,
        "pathRewrite": {
            "^/test": ""
        }
    }
}

6.完美解決不用打包的時候每次替換前綴,只須要執行不一樣的打包命令便可