uni-app cli創建配置多環境讀取配置文件信息
在項目src下創建以下配置文件
在package.json中添加以下代碼
VUE_APP_ENV：用來區分環境 NODE_ENV：用來定死打包目錄，只會打包在dist/build/xxx下 ，因為是用的是vue-cli3的架子，所以環境變量需要使用 VUE_APP_ 開頭
"build-dev": "npm run build:dev",
"build:dev": "cross-env VUE_APP_ENV=development NODE_ENV=production UNI_PLATFORM=h5 vue-cli-service uni-build",
"build-qa": "npm run build:qa",
"build:qa": "cross-env VUE_APP_ENV=qa NODE_ENV=production UNI_PLATFORM=h5 vue-cli-service uni-build",
"build-uat": "npm run build:uat",
"build:uat": "cross-env VUE_APP_ENV=uat NODE_ENV=production UNI_PLATFORM=h5 vue-cli-service uni-build",
"build-prd": "npm run build:prd",
"build:prd": "cross-env VUE_APP_ENV=production NODE_ENV=production UNI_PLATFORM=h5 vue-cli-service uni-build",
1
2
3
4
5
6
7
8
env.js文件下添加以下代碼
(function() {
let ENV_VAR = null
console.log(process.env)
// 只開發 android跟ios
switch (process.env.VUE_APP_PLATFORM) {
case 'app-plus':
//訪問路徑
ENV_VAR = require('env.'+ process.env.VUE_APP_ENV +'.js');
break
case 'h5':
//訪問路徑
ENV_VAR = require('env.'+ process.env.VUE_APP_ENV +'.js');
break
default:
console.warn('error')
break
}
if(ENV_VAR){
process.uniEnv = Object.create({})
for (let key in ENV_VAR) {
process.uniEnv[key] = ENV_VAR[key];
}
}
})()
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
app.vue中引入 env.js
import 'env';
1
各個配置文件中的代碼信息，這邊只貼了開發環境
const UNI_APP = {
//開發環境
BaseUrl:'',
env:'development',
}
module.exports = UNI_APP
1
2
3
4
5
6
7
接下來執行打包dev環境命令
這邊可以看到咱們成功讀取到配置文件中的信息啦。
使用process.uniEnv在js中就可以獲取到配置文件中整個對象
————————————————
版權聲明：本文為CSDN博主「imFanYang」的原創文章，遵循CC 4.0 BY-SA版權協議，轉載請附上原文出處鏈接及本聲明。
原文鏈接：https://blog.csdn.net/weixin_44515767/article/details/116764083