1、在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', };
2、重点是第二步(有别于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" } ] }
3、在接口服务里引入
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}`);
}
4、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.完美解决不用打包的时候每次替换前缀,只需要执行不同的打包命令即可