在uni-app中，可以通过condition编译条件来实现不同环境下的自定义条件编译。
- 在
manifest.json中配置编译条件：
"condition": {
"current": 0, // 当前生效的编译条件的索引
"list": [
{
"name": "开发环境",
"API_BASE_URL": "https://dev.example.com",
"condition": {
"#ifdef H5": {
"UA": "Development-H5"
},
"#ifdef MP-WEIXIN": {
"UA": "Development-WeChat"
},
// ...其他小程序平台
"#ifdef APP-PLUS": {
"UA": "Development-APP"
}
// ...其他APP条件
}
},
{
"name": "测试环境",
"API_BASE_URL": "https://test.example.com",
"condition": {
"#ifdef H5": {
"UA": "Test-H5"
},
// ...其他条件
}
// ...其他环境配置
},
// ...更多环境配置
]
}- 在代码中使用条件编译变量：
// 示例：根据不同环境设置API基础路径
const baseUrl = process.env.VUE_APP_API_BASE_URL || '';
// 示例：根据不同环境设置用户代理字符串
const userAgent = process.env.VUE_APP_UA || 'Default-User-Agent';
// 使用环境变量进行API请求或其他逻辑处理- 在
vue.config.js中配置环境变量：
// 根据不同的编译条件设置不同的环境变量
const env = require('./env.js');
module.exports = {
// ...其他配置
configureWebpack: {
// 通过cross-env设置环境变量
// 例如："cross-env UNI_PLATFORM=mp-weixin UNI_ENV=prod"
define: {
'process.env': env[process.env.UNI_PLATFORM] || env['development']
}
}
};- 创建
env.js文件定义不同环境下的变量：
module.exports = {
'development': {
'NODE_ENV': '"development"',
// ...其他变量
},
'production': {
'NODE_ENV': '"production"',
// ...其他变量
},
// ...其他平台的环境变量
};通过以上步骤，可以在uni-app项目中根据不同的编译条件配置不同的环境变量和运行时条件编译。在代码中，可以通过process.env访问这些环境变量，实现不同环境下的逻辑分流。