項(xiàng)目根目錄下創(chuàng)建.env、.env.development和.env.production三個文件，文件名解釋分別如下：
.env 無論開發(fā)環(huán)境還是生產(chǎn)環(huán)境都會加載的配置文件
.env.development 開發(fā)環(huán)境加載的配置文件
.env.production 生產(chǎn)環(huán)境加載的配置文件
環(huán)境變量的簡單使用示例。需要注意，配置文件里的屬性名必須以VUE_APP_開頭，比如在.env文件這樣聲明一個環(huán)境變量：
VUE_APP_QQQ = `QQ`
然后就可以在代碼里這樣用了：
console.log(process.env.VUE_APP_QQQ) // -> `QQ`
那為什么是三個文件呢？
比如現(xiàn)在三個文件里內(nèi)容分別如下：
// .env
VUE_APP_QQQ = `QQ`
// .env.development
VUE_APP_QQQ = `WW`
// .env.production
VUE_APP_QQQ = `RR`
那么首先，Vue在啟動時，無論是在開發(fā)環(huán)境還是在生產(chǎn)環(huán)境，它始終都會加載.env文件里的內(nèi)容，然后（劃重點(diǎn)）=>根據(jù)Node環(huán)境變量'NODE_ENV'的值來選擇加載'development'還是'production'。
比如我們平常通過npm run serve啟動時，我們本地系統(tǒng)的環(huán)境變量NODE_ENV 值默認(rèn)是development，這時就會先后加載.env和.env.development這兩個文件。
而當(dāng)我們打包到服務(wù)器后，服務(wù)器的NODE_ENV值一般為production，則此時Vue仍會先加載.env文件，然后加載.env.production文件。
其次，在按順序加載文件時，Vue會把后一個加載的文件內(nèi)容和前面加載的文件內(nèi)容進(jìn)行比較，如果存在變量名相同，那么它會采用后一個文件里的變量值為變量的最終值。
拿上面三個文件內(nèi)容打個比方：我們在日常開發(fā)時，NODE_ENV值是development，那么Vue就會首先加載.env文件里的內(nèi)容，然后繼續(xù)加載.env.development文件里的內(nèi)容。那么我們發(fā)現(xiàn)變量名VUE_APP_QQQ存在多個，這時Vue就會采用后一個文件里的變量值為變量的最終值。因此我們通過console輸出看一看。
console.log(VUE_APP_QQQ) // -> `WW`
