uni-app 多环境配置

前后端分离模式下,不同的环境如开发环境(dev)、测试环境(test)、生产环境(prod)等,不同环境后端数据库、api地址等可能都不同 。
uni-app中只有development和production两个环境
以配置api地址为例

方案1

javascript 复制代码
const developmentUrl = 'http://102.168.101.222:10086/';
const productionUrl = 'http://xxx.xxx.xxx.xxx:xxxxx/';

const baseUrl = process.env.NODE_ENV === 'development' ? developmentUrl : productionUrl;
//uni-app 可通过 process.env.NODE_ENV 判断当前环境是开发环境还是生产环境。一般用于连接测试服务器或生产服务器的动态切换
// 假设只需要对单一平台配置,可以 package.json 中配置,在 HBuilderX 的运行和发行菜单里会多一个出来。https://uniapp.dcloud.io/collocation/package

fetchApi:async function(url,requestType,data,asyncFlag=true,header){
        var fetchUrl=baseUrl + url;
         ....
}

方案2

javascript 复制代码
//.env.development文件
VITE_API_URL=http://http://102.168.101.222:10086/
javascript 复制代码
//.env.production文件
VITE_API_URL=http://xxx.xxx.xxx.xxx:xxxxx/

需要使用的到时,如

javascript 复制代码
config: {
         baseURL: import.meta.env.VITE_API_URL,
             ...
}

建议使用方案2,将生产环境配置与开发环境配置区分在不同文件,更加清晰。

相关推荐
雪芽蓝域zzs2 小时前
uni-app倒计时公共组件 封装,倒计时组件
uni-app
2501_915918415 小时前
iOS 开发全流程实战 基于 uni-app 的 iOS 应用开发、打包、测试与上架流程详解
android·ios·小程序·https·uni-app·iphone·webview
黑马源码库miui520865 小时前
JAVA同城打车小程序APP打车顺风车滴滴车跑腿源码微信小程序打车源码
java·微信·微信小程序·小程序·uni-app
清风细雨_林木木10 小时前
uni-app 和 uni-app x 的区别
uni-app
iOS阿玮10 小时前
期待iOS开发者加入,共同抵制“苹果税”反垄断招募令!
uni-app·app·apple
普通网友11 小时前
支持二次开发的代练App源码:订单管理、代练监控、安全护航功能齐全,一站式解决代练护航平台源码(PHP+ Uni-app)
安全·uni-app·php
蜕变菜鸟11 小时前
uview使用u-popup组件当开启遮罩层禁止下层页面滚动。uniapp弹框禁止页面上下滚动。
uni-app
吴传逞2 天前
记一次uniapp微信小程序开发scss变量失效的问题
微信小程序·uni-app·scss
2501_915921432 天前
小团队如何高效完成 uni-app iOS 上架,从分工到工具组合的实战经验
android·ios·小程序·uni-app·cocoa·iphone·webview
2501_916008892 天前
uni-app iOS 文件管理与 itools 配合实战,多工具协作的完整流程
android·ios·小程序·https·uni-app·iphone·webview