Vue 項目分環(huán)境打包的方法示例
更新時間：2018年08月03日 08:31:42 作者：碼路芽子
這篇文章主要介紹了Vue 項目分環(huán)境打包的方法示例，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
我們開發(fā)項目的時候，用vue-cli 2.x版本新建的項目，只有dev, pro兩種開發(fā)環(huán)境, 有時需要個test環(huán)境來給測試使用，所以找了很多方法，總結(jié)了個最簡單的方法來給大家使用
1、package.json
在build下面添加一個test運行命令
"test": "node build/build.js"
2、prod.env.js
在config -> prod.env.js 中修改代碼
'use strict'
// 讀取系統(tǒng)運行時候的變量
const target = process.env.npm_lifecycle_event;
// 控制臺日志輸出
console.log('env is deploying, current env is', target)
// 判斷環(huán)境變量，是test，還是build
if (target == 'test') {
var obj = {
NODE_ENV: '"production"',
API_ROOT: '"此處替換為測試環(huán)境地址"',
}
} else {
var obj = {
NODE_ENV: '"production"',
API_ROOT: '"此處替換為測試環(huán)境地址"',
}
}
module.exports = obj;
3.測試環(huán)境：
$ npm run test
正式環(huán)境:
``` $ npm run build ```
以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
vue-cli2 構(gòu)建速度優(yōu)化的實現(xiàn)方法
這篇文章主要介紹了vue-cli2 構(gòu)建速度優(yōu)化的實現(xiàn)方法，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2019-01-01
這篇文章主要為大家介紹了Vue?element樹形控件添加虛線，具有一定的參考價值，感興趣的小伙伴們可以參考一下，希望能夠給你帶來幫助<BR>2021-11-11
Vue.js 3.x 中的響應(yīng)式數(shù)據(jù)ref 與 reactive詳解
ref 和 reactive 是 Vue.js 3 中用于創(chuàng)建響應(yīng)式數(shù)據(jù)的兩個關(guān)鍵函數(shù),它們分別適用于不同類型的數(shù)據(jù),幫助我們更好地組織和管理組件的狀態(tài),這篇文章主要介紹了Vue.js 3.x 中的響應(yīng)式數(shù)據(jù)：ref 與 reactive,需要的朋友可以參考下2024-01-01
在項目開發(fā)過程中,可能需要實現(xiàn)以下場景,未讀消息提示、報警信息、消息通知等,下面這篇文章主要給大家介紹了關(guān)于vue通知提醒消息的相關(guān)資料,需要的朋友可以參考下2023-03-03
Vuex的官方解釋是一個專為vue.js應(yīng)用程序開發(fā)的狀態(tài)管理模式，這篇文章主要為大家介紹了Vuex的具體用法，希望對大家深入了解Vuex有一定的幫助2023-06-06
Vue2仿淘寶實現(xiàn)省市區(qū)三級聯(lián)動
這篇文章主要為大家詳細介紹了Vue2仿淘寶實現(xiàn)省市區(qū)三級聯(lián)動，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-11-11
這篇文章主要介紹了vue中為何方法要寫在methods的里面，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-10-10
Vue中iframe?結(jié)合?window.postMessage?實現(xiàn)跨域通信
window.postMessage()?方法可以安全地實現(xiàn)跨源通信，在一個項目的頁面中嵌入另一個項目的頁面，需要實現(xiàn)父子，子父頁面的通信，對Vue中iframe?結(jié)合?window.postMessage?實現(xiàn)跨域通信相關(guān)知識感興趣的朋友跟隨小編一起看看吧2022-12-12
vue3 響應(yīng)式對象如何實現(xiàn)方法的不同點
這篇文章主要介紹了vue3 響應(yīng)式對象如何實現(xiàn)方法的不同點，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-05-05
vue el-select綁定對象時,回顯內(nèi)容不正確,始終是最后一項的解決
這篇文章主要介紹了vue el-select綁定對象時,回顯內(nèi)容不正確,始終是最后一項的問題及解決方案，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-07-07