1、条件编译
对应某个特殊平台进行单独编写代码,js、css、json皆可条件编译
// #ifdef %PLATFORM%
平台特有的API实现
// #endif
2、拓展条件编译
比如发布h5,但是可能会放到不同的浏览器里面(qq、钉钉、微信浏览器中),由于浏览器不同,可能会有些微差异需要进行单独适配,拓展条件编译
官网添加条件编译说明 现在可以争对h5进行条件编译,所以钉钉、qq等浏览器都是可以识别这个编译的,但是现在还需要做一个只有钉钉才能识别的编译条件,qq不能识别
拓展方式如下:(官网直接搬运说明)
{
/**
* package.json其它原有配置
* 拷贝代码后请去掉注释!
*/
"uni-app": {// 扩展配置
"scripts": {
"custom-platform": { //自定义编译平台配置,可通过cli方式调用
"title":"自定义扩展名称", // 在HBuilderX中会显示在 运行/发行 菜单中
"browser":"", //运行到的目标浏览器,仅当UNI_PLATFORM为h5时有效
"env": {//环境变量
"UNI_PLATFORM": "", //基准平台
"MY_TEST": "", // ... 其他自定义环境变量
},
"define": { //自定义条件编译
"CUSTOM-CONST": true //自定义条件编译常量,建议为大写
}
}
}
}
}
示例:钉钉h5
1、添加配置
"uni-app": {
"scripts": {
"h5-dingtalk": {
"title":"钉钉h5发布",
"env": {
"UNI_PLATFORM": "h5"
},
"define": {
"H5-DINGTALK": true
}
}
}
}
代码中使用H5-DINGTALK进行条件编译,如下:
// #ifdef H5
h5平台通用代码(含钉钉、qq等)
// #endif
// #ifdef H5-DINGTALK
钉钉平台通用代码(钉钉可以识别、qq等其他浏览器识别不了)
// #endif
运行及发布项目:
vue-cli开发者可通过如下命令,启动钉钉小程序平台的编译:
//开发
npm run dev:custom h5-dingtalk
//发布
npm run build:custom h5-dingtalk
HBuilderX会根据package.json的扩展配置,在运行、发行菜单下,生成自定义菜单(钉钉h5发布),开发者点击对应菜单编译运行即可,如下图:
注意:假设 h5这个是第一级,下面的钉钉、qq、微信等浏览器作为第二级,条件编译只能拓展第二级,不能拓展第一级