- 参考文档
https://blog.csdn.net/Amy_cloud/article/details/92638555
uni本身运行的时候。只是区分了h5、小程序 APP等环境，但是在实际开发中，项目还会有测试以及正式环境，像我们公司，拥有测试、预发布、生产三套环境，三套环境请求地址都有不同，需要单独配置
修改打包命令
以新增h5多环境配置举例
这里为了方便测试。改的都是dev命令，方便调试
打开package.json，在scripts中新增命令
// 运行命令
"dev:h5": "cross-env NODE_ENV=development UNI_PLATFORM=h5 vue-cli-service uni-serve --mode dev",
"dev:h5-pre": "cross-env NODE_ENV=development VUE_APP_ENV=pre UNI_PLATFORM=h5 vue-cli-service uni-serve --mode pre",
"dev:h5-prod": "cross-env NODE_ENV=development VUE_APP_ENV=prod UNI_PLATFORM=h5 vue-cli-service uni-serve --mode prod"
// 打包命令
"build:h5": "cross-env NODE_ENV=production UNI_PLATFORM=h5 vue-cli-service uni-build --mode prod",
"build:h5-pre": "cross-env NODE_ENV=production UNI_PLATFORM=h5 vue-cli-service uni-build --mode pre",
"build:h5-dev": "cross-env NODE_ENV=production UNI_PLATFORM=h5 vue-cli-service uni-build --mode dev",
末尾增加了mode参数，vue-cli3会根据mode参数不同去寻找合适的打包文件
- dev => 测试环境
- pre => 预发布环境
- prod => 正式环境
在项目根目录创建配置文件
注意.env.xxx要对应mode的参数，cli会自动寻找对应的配置文件进行合并
接下来以
.env.dev文件举例子
// NODE_ENV = 'development' // 编译模式，我的项目里运行也用到了这个配置项，所以没有指定，根据项目状况来处理
VUE_APP_CURRENTMODE = 'dev' // 自定义的环境参数
VUE_APP_BASEURL = '本地开发api地址' // 请求地址
以同样的方法配置.env.pre和.env.prod，修改参数
运行项目的命令 npm run dev:h5-xxx和npm run build-xxx
打包出来的结果预览
预发布环境下，在页面中打印process.env 输出的结果如下
