配置多環(huán)境打包
在根目錄下添加幾個文件
1.添加 .env
NODE_ENV = development
VUE_APP_BASEURL = 'window.location.origin' // 網絡請求地址
2.添加.env.prod
NODE_ENV = production
VUE_APP_URL = prod
VUE_APP_BASEURL = 'window.location.origin' // 網絡請求地址
3.添加.env.beta
NODE_ENV = production
VUE_APP_URL = beta
VUE_APP_BASEURL = 'window.location.origin' // 網絡請求地址
修改 vue.config.js
module.exports = {
publicPath: process.env.VUE_APP_URL
}
修改 index.js
export default new Router({
base: process.env.VUE_APP_URL
})
修改package.json
"scripts": {
"serve": "vue-cli-service serve --mode",
"build": "vue-cli-service build --mode prod",
"beta": "vue-cli-service build --mode beta",
},
到這里，多環(huán)境已經配置完畢
項目中可以通過 process.env.[key] 去做權限判斷
默認打包后的文件名字是 dist 如果想要指定名稱骚秦，你可以這樣做
1.修改啟動命令 在后面加上 --dest [name]
例如我想要打包后的名字是 beta
"beta": "vue-cli-service build --mode beta --dest beta",
2.修改 .gitignore
.DS_Store
···
/beta
這個操作是為了防止提交代碼時將部署文件一并提交
如果你發(fā)現(xiàn)打包后的體積超級大
修改NODE_ENV = 'production' --> NODE_ENV = production
完美错览，這就是全部的解決方案了！！矮燎！
