实际开发中，我们经常需要配置多个环境，如：开发环境、测试环境、生产环境。
比如接口的地址在不同环境下各有一个地址，如：
开发环境：http://dev.xxx.xxx
测试环境：http://test.xxx.xxx
生产环境：http://www.xxx.xxx
Angular给我们提供了一个很方便的方式，就是通过environment变量来控制
1、找到src/environments目录，
用@angular/cli工具创建的项目默认会有environment.prod.ts(生产环境)
和environment.ts(开发环境)，为了方便测试环境，我们再新建一个文件，
命名为：environment.test.ts(测试环境)，
在这三个文件中写入不同环境下的变量值，如：
// 其中 production 为是否按照生成环境打包代码
// environment.ts
export const environment = {
production: false,
domainUrl:'http://dev.xxx.xxx'
};
// environment.test.ts
export const environment = {
production: true,
domainUrl:'http://test.xxx.xxx'
};
// environment.prod.ts
export const environment = {
production: true,
domainUrl:'http://www.xxx.xxx'
};
后面步骤要分为angular5及以下和angular6及以上
2、angular5及以下 配置.angular-cli.json
找到文件.angular-cli.json，在environments下增加一个测试环境的配置，如下：
"environments": {
"dev": "environments/environment.ts",
"test": "environments/environment.test.ts",
"prod": "environments/environment.prod.ts"
}
3、angular5及以下 打包命令如下：
ng build --env=prod（打包生产环境）
ng build --env=test（打包测试环境）
2、angular6及以上 配置angular.json
找到 projects - architect - build - configurations 增加一个测试环境的配置，配置如下：
"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、angular6及以上 打包命令如下：
ng build --prod --configuration=production（打包生产环境）
ng build --prod --configuration=test（打包测试环境）
4、在代码中使用环境变量
（1）可以在tsconfig.json 中的 paths 对象中添加配置
"@env/*": ["environments/*"]
（2）其他需要用到的组件服务中引入
import { environment } from '@env/environment';
// 即可使用 environment 对象的一些属性如：
// environment.domainUrl
默认情况下，@angular/cli创建的时候还会给我们在environment.ts/environment.prod.ts文件中创建一个变量production，该变量的作用就是控制是否开启Angular的开发模式，在main.ts中有这句代码：
if (environment.production) {
enableProdMode();
}
通过该变量值，我们就可以选择性的开启和关闭开发模式。