vue項(xiàng)目在env文件中設(shè)置的變量無(wú)效問(wèn)題及解決
vue項(xiàng)目在env文件中設(shè)置的變量無(wú)效
vue項(xiàng)目,在開(kāi)發(fā)過(guò)程中需要設(shè)置環(huán)境變量,但是在env文件中設(shè)置了變量值,但是無(wú)效
經(jīng)查閱資料發(fā)現(xiàn),vue項(xiàng)目的env變量需要加上“VUE_APP_”前綴。
請(qǐng)注意:
- 只有 NODE_ENV,BASE_URL 和以 VUE_APP_ 開(kāi)頭的變量將通過(guò) webpack.DefinePlugin 靜態(tài)地嵌入到客戶端側(cè)的代碼中。
- 這是為了避免意外公開(kāi)機(jī)器上可能具有相同名稱的私鑰。
// 錯(cuò)誤的設(shè)置方式 BASE_API_PREFIX = '/api' // 正確的設(shè)置方式 VUE_APP_BASE_API_PREFIX = '/api'
在.env.development文件中設(shè)置全局變量沒(méi)有生效
在平臺(tái)上線時(shí)需要區(qū)分開(kāi)發(fā)環(huán)境和生產(chǎn)環(huán)境,所以在.env.development和.env.production中進(jìn)行配置。
然而我設(shè)置了變量,發(fā)現(xiàn)并沒(méi)有生效。
我設(shè)置的代碼
如下:

這么設(shè)置變量是不可以的,所有的變量都要以VUE_APP_開(kāi)頭才可以生效
正確的寫(xiě)法
如圖:

總結(jié)
以上為個(gè)人經(jīng)驗(yàn),希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
相關(guān)文章
vue深拷貝的3種實(shí)現(xiàn)方式小結(jié)
當(dāng)使用同一個(gè)對(duì)象產(chǎn)生沖突時(shí),可以使用lodash包,對(duì)該對(duì)象進(jìn)行深拷貝,從而使操作的對(duì)象為不同的對(duì)象,這篇文章主要給大家介紹了關(guān)于vue深拷貝的3種實(shí)現(xiàn)方式,需要的朋友可以參考下2023-02-02
解決Vue.js應(yīng)用回退或刷新界面時(shí)提示用戶保存修改問(wèn)題
這篇文章主要介紹了Vue.js應(yīng)用回退或刷新界面時(shí)提示用戶保存修改問(wèn)題,本文通過(guò)兩種手段防止運(yùn)營(yíng)編輯時(shí)丟失數(shù)據(jù),具體內(nèi)容詳情,感興趣的朋友跟隨小編一起看看吧2019-11-11
vue數(shù)據(jù)雙向綁定原理解析(get & set)
這篇文章主要為大家詳細(xì)解析了vue.js數(shù)據(jù)雙向綁定原理,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-03-03

