uniapp+vue3+vite实现多环境打包

【uniapp+vue3+vite实现多环境打包】根据uniapp官方文档,生成vue3项目命令

npx degit dcloudio/uni-preset-vue#vite my-vue3-project

目前项目基本都存在多环境配置,在package.json文件中添加自己想要的命令在这里我添加了四个分别代表开发环境、测试环境、预发布环境和正式环境配置
然而脚手架生产的package.json是和旧版的不一样的
旧版
uniapp+vue3+vite实现多环境打包
文章图片

新版
uniapp+vue3+vite实现多环境打包
文章图片

我们只需要添加--mode [变量名] 就好了
例如:小程序打包测试环境
"build-test:mp-weixin": "uni --mode test -p mp-weixin" npm run build-test:mp:weixin

这样vite就会找到对应的环境文件
当在js里想获取当前环境名时,只需输出import.meta.env.MODE
注: 为了防止意外地将env变量泄漏到客户端,只有以VITE_前缀的变量才会暴露给经过VITE_处理的代码

    推荐阅读