實際開發中,我們經常需要配置多個環境,如:開發環境、生產環境、測試環境,比如接口的地址在不同環境下各有一個地址,如:
開發環境:http://dev.xxx.xxx
生產環境:http://www.xxx.xxx
測試環境:http://test.xxx.xxx
Angular給我們提供了一個很方便的方式,就是通過environment變量來控制
1、找到src/environments目錄,用angular-cli工具創建的項目默認會有environment.prod.ts(生產環境)和environment.ts(開發環境),爲了方便測試環境,我們再新建一個文件,命名爲:environment.test.ts(測試環境),在這三個文件中寫入不同環境下的變量值,如:
export const environment = {
domainUrl:'我是測試環境的配置'
};
2、找到文件.angular-cli.json,在environments下增加一個測試環境的配置,如下:
"environments": {
"dev": "environments/environment.ts",
"prod": "environments/environment.prod.ts",
"test": "environments/environment.test.ts"
}
3、打包命令如下:
ng build --env=dev(打包開發環境)
ng build --env=prod(打包生產環境)
ng build --env=test(打包測試環境)
默認情況下,angular-cli創建的時候還會給我們在environment.ts/environment.prod.ts文件中創建一個變量production,該變量的作用就是控制是否開啓Angular的開發模式,在main.ts中有這句代碼:
if (environment.production) {
enableProdMode();
}