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.完美解决不用打包的时候每次替换前缀,只需要执行不同的打包命令即可