在項(xiàng)目中一個(gè)項(xiàng)目對(duì)應(yīng)多個(gè)環(huán)境是非常常見的且蓬,至少你需要面對(duì)開發(fā)审残、測(cè)試、生產(chǎn)三個(gè)環(huán)境暂幼。
以前我有個(gè)很笨的方法筹煮,創(chuàng)建一個(gè)constant.ts文件遮精,把三個(gè)環(huán)境的地址寫上去,用到哪個(gè)把另外兩個(gè)注釋掉。
這個(gè)方法簡(jiǎn)單本冲,但是很容易出錯(cuò)准脂。萬一生產(chǎn)包忘記改地址就會(huì)出大問題。
優(yōu)化一下檬洞,在src/environments下已經(jīng)有兩個(gè)文件enviroment.ts 和 environments.prod.ts,我們?cè)傩略鲆粋€(gè)environments.stage.ts
三個(gè)文件內(nèi)容也修改一下狸膏,增加ServerAddress參數(shù)并填寫開發(fā)、測(cè)試添怔、生產(chǎn)所對(duì)應(yīng)的服務(wù)地址湾戳。
然后打開angular.json修改配置
“production”的配置已經(jīng)有了,我們復(fù)制一份production的配置广料,將名稱改為“stage”砾脑,“fileReplacements“-“with”改為剛創(chuàng)建的environment.stage.ts
修改constant.ts的ServerAddress
命令
生產(chǎn)環(huán)境
編譯:ng build --prod 或 ng build --configuration=production
運(yùn)行:?ng serve --configuration=production
測(cè)試環(huán)境
編譯: ng build?--configuration=stage
運(yùn)行: ng serve--configuration=stage
開發(fā)環(huán)境
編譯:ng build
運(yùn)行:ng serve