新聞中心
你可以替換你的項(xiàng)目根目錄中的下列文件來指定環(huán)境變量:

員工經(jīng)過長(zhǎng)期磨合與沉淀,具備了協(xié)作精神,得以通過團(tuán)隊(duì)的力量開發(fā)出優(yōu)質(zhì)的產(chǎn)品。創(chuàng)新互聯(lián)堅(jiān)持“專注、創(chuàng)新、易用”的產(chǎn)品理念,因?yàn)椤皩W⑺詫I(yè)、創(chuàng)新互聯(lián)網(wǎng)站所以易用所以簡(jiǎn)單”。公司專注于為企業(yè)提供成都網(wǎng)站設(shè)計(jì)、做網(wǎng)站、成都外貿(mào)網(wǎng)站建設(shè)公司、微信公眾號(hào)開發(fā)、電商網(wǎng)站開發(fā),重慶小程序開發(fā),軟件定制設(shè)計(jì)等一站式互聯(lián)網(wǎng)企業(yè)服務(wù)。
.env # 在所有的環(huán)境中被載入
.env.local # 在所有的環(huán)境中被載入,但會(huì)被 git 忽略
.env.[mode] # 只在指定的模式中被載入
.env.[mode].local # 只在指定的模式中被載入,但會(huì)被 git 忽略
一個(gè)環(huán)境文件只包含環(huán)境變量的“鍵=值”對(duì):
FOO=bar
Vue_APP_SECRET=secret
被載入的變量將會(huì)對(duì) vue-cli-service 的所有命令、插件和依賴可用。
環(huán)境加載屬性
為一個(gè)特定模式準(zhǔn)備的環(huán)境文件的 (例如 .env.production) 將會(huì)比一般的環(huán)境文件 (例如 .env) 擁有更高的優(yōu)先級(jí)。
此外,Vue CLI 啟動(dòng)時(shí)已經(jīng)存在的環(huán)境變量擁有最高優(yōu)先級(jí),并不會(huì)被 .env 文件覆寫。
NODE_ENV
如果在環(huán)境中有默認(rèn)的 NODE_ENV,你應(yīng)該移除它或在運(yùn)行 vue-cli-service 命令的時(shí)候明確地設(shè)置 NODE_ENV。
模式
模式是 Vue CLI 項(xiàng)目中一個(gè)重要的概念。默認(rèn)情況下,一個(gè) Vue CLI 項(xiàng)目有三個(gè)模式:
- development 模式用于 vue-cli-service serve
- production 模式用于 vue-cli-service build 和 vue-cli-service test:e2e
- test 模式用于 vue-cli-service test:unit
注意模式不同于 NODE_ENV,一個(gè)模式可以包含多個(gè)環(huán)境變量。也就是說,每個(gè)模式都會(huì)將 NODE_ENV 的值設(shè)置為模式的名稱——比如在 development 模式下 NODE_ENV 的值會(huì)被設(shè)置為 "development"。
你可以通過為 .env 文件增加后綴來設(shè)置某個(gè)模式下特有的環(huán)境變量。比如,如果你在項(xiàng)目根目錄創(chuàng)建一個(gè)名為 .env.development 的文件,那么在這個(gè)文件里聲明過的變量就只會(huì)在 development 模式下被載入。
你可以通過傳遞 --mode 選項(xiàng)參數(shù)為命令行覆寫默認(rèn)的模式。例如,如果你想要在構(gòu)建命令中使用開發(fā)環(huán)境變量,請(qǐng)?jiān)谀愕?nbsp;package.json 腳本中加入:
"dev-build": "vue-cli-service build --mode development",
示例:Staging 模式
假設(shè)我們有一個(gè)應(yīng)用包含以下 .env 文件:
VUE_APP_TITLE=My App
和 .env.staging 文件:
NODE_ENV=production
VUE_APP_TITLE=My App (staging)
- vue-cli-service build 會(huì)加載可能存在的 .env、.env.production 和 .env.production.local 文件然后構(gòu)建出生產(chǎn)環(huán)境應(yīng)用;
- vue-cli-service build --mode staging 會(huì)在 staging 模式下加載可能存在的 .env、.env.staging 和 .env.staging.local 文件然后構(gòu)建出生產(chǎn)環(huán)境應(yīng)用。
這兩種情況下,根據(jù) NODE_ENV,構(gòu)建出的應(yīng)用都是生產(chǎn)環(huán)境應(yīng)用,但是在 staging 版本中,process.env.VUE_APP_TITLE 被覆寫成了另一個(gè)值。
在客戶端側(cè)代碼中使用環(huán)境變量
只有以 VUE_APP_ 開頭的變量會(huì)被 webpack.DefinePlugin 靜態(tài)嵌入到客戶端側(cè)的包中。你可以在應(yīng)用的代碼中這樣訪問它們:
console.log(process.env.VUE_APP_SECRET)
在構(gòu)建過程中,process.env.VUE_APP_SECRET 將會(huì)被相應(yīng)的值所取代。在 VUE_APP_SECRET=secret 的情況下,它會(huì)被替換為 "secret"。
除了 VUE_APP_* 變量之外,在你的應(yīng)用代碼中始終可用的還有兩個(gè)特殊的變量:
- NODE_ENV - 會(huì)是 "development"、"production" 或 "test" 中的一個(gè)。具體的值取決于應(yīng)用運(yùn)行的模式。
- BASE_URL - 會(huì)和 vue.config.js 中的 publicPath 選項(xiàng)相符,即你的應(yīng)用會(huì)部署到的基礎(chǔ)路徑。
所有解析出來的環(huán)境變量都可以在 public/index.html 中以 HTML 插值中介紹的方式使用。
提示
你可以在 vue.config.js 文件中計(jì)算環(huán)境變量。它們?nèi)匀恍枰?nbsp;VUE_APP_ 前綴開頭。這可以用于版本信息 process.env.VUE_APP_VERSION = require('./package.json').version。
只在本地有效的變量
有的時(shí)候你可能有一些不應(yīng)該提交到代碼倉庫中的變量,尤其是當(dāng)你的項(xiàng)目托管在公共倉庫時(shí)。這種情況下你應(yīng)該使用一個(gè) .env.local 文件取而代之。本地環(huán)境文件默認(rèn)會(huì)被忽略,且出現(xiàn)在 .gitignore 中。
.local 也可以加在指定模式的環(huán)境文件上,比如 .env.development.local 將會(huì)在 development 模式下被載入,且被 git 忽略。
分享名稱:創(chuàng)新互聯(lián)VueCLI教程:VueCLI環(huán)境變量和模式
分享網(wǎng)址:http://m.5511xx.com/article/ccoopic.html


咨詢
建站咨詢
