uniapp 区分环境
uniapp 区分环境的方法
uniapp 提供了多种方式来区分开发环境和生产环境,以便在不同环境下执行不同的逻辑或配置。以下是常见的几种方法:
使用 process.env.NODE_ENV
在代码中可以通过 process.env.NODE_ENV 获取当前环境,值为 development(开发环境)或 production(生产环境)。
示例代码:
if (process.env.NODE_ENV === 'development') {
console.log('开发环境');
} else {
console.log('生产环境');
}
配置 manifest.json 的自定义条件编译
在 manifest.json 中配置自定义条件编译变量,通过 process.env.UNI_PLATFORM 或 process.env.UNI_OS 区分平台或操作系统。
示例:
{
"h5": {
"devServer": {
"port": 8080
}
},
"mp-weixin": {
"appid": "your-appid"
}
}
通过条件编译区分平台
uniapp 支持条件编译语法,可以在代码中直接根据不同平台执行不同逻辑。
示例:
// #ifdef H5
console.log('H5 平台');
// #endif
// #ifdef MP-WEIXIN
console.log('微信小程序平台');
// #endif
自定义环境变量
在项目根目录下创建 .env、.env.development 和 .env.production 文件,分别配置不同环境变量。
示例 .env.development:
VUE_APP_API_BASE_URL=http://dev.example.com/api
示例 .env.production:
VUE_APP_API_BASE_URL=https://prod.example.com/api
在代码中通过 process.env.VUE_APP_API_BASE_URL 访问。
使用 uni.getSystemInfoSync() 区分运行环境
通过 uni.getSystemInfoSync() 获取运行环境信息,如操作系统、平台等。
示例代码:
const systemInfo = uni.getSystemInfoSync();
console.log(systemInfo.platform); // 输出运行平台(ios、android 等)
结合构建命令区分环境
在 package.json 中配置不同的构建命令,传递环境变量。
示例:
{
"scripts": {
"build:dev": "cross-env NODE_ENV=development uni-build",
"build:prod": "cross-env NODE_ENV=production uni-build"
}
}
以上方法可以根据实际需求选择或组合使用,灵活应对不同场景下的环境区分需求。







