uni-app #ifdef #ifndef #endif的使用和区别

1. uni-app #ifdef #ifndef #endif的使用和区别

条件编译是一种在编程中根据特定平台选择性编译代码的技术。如#ifdef和#endif根据APP-PLUS平台标识在微信小程序、支付宝小程序、百度小程序、头条小程序、QQ小程序以及H5应用中实现代码的平台特定执行。下面介绍了如何使用#ifdef和#ifndef等注释来标记代码块,确保它们在H5、5+App、微信小程序等不同平台上正确执行编译。通过这种方式,开发者可以实现代码的平台定制,提高代码的可移植性和效率。

1.1. #ifdef #ifndef #endif三者

写法:以 #ifdef 或 #ifndef 加 %PLATFORM% 开头,以 #endif 结尾。

名称 作用
#ifdef 仅在某个平台上使用0
#ifndef 在除了这个平台的其他平台上使用(非此平台使用)
#endif 结束条件编译

1.2. 平台标识

1.2.1. 生效条件

标识 生效条件
VUE3 uni-app js引擎版用于区分vue2和3,
VUE2 uni-app js引擎版用于区分vue2和3
UNI-APP-X 用于区分是否是uni-app x项目
uniVersion 用于区分编译器的版本
APP App
APP-PLUS uni-app js引擎版编译为App时
APP-PLUS-NVUE或APP-NVUE App nvue 页面
APP-ANDROID App Android 平台 详情
APP-IOS App iOS 平台 详情
H5 H5(推荐使用 WEB)
WEB web(同H5) HBuilderX 3.6.3+
MP-WEIXIN 微信小程序
MP-ALIPAY 支付宝小程序
MP-BAIDU 百度小程序
MP-TOUTIAO 抖音小程序
MP-LARK 飞书小程序
MP-QQ QQ小程序
MP-KUAISHOU 快手小程序
MP-JD 京东小程序
MP-360 360小程序
MP 微信小程序/支付宝小程序/百度小程序/抖音小程序/飞书小程序/QQ小程序/360小程序
QUICKAPP-WEBVIEW 快应用通用(包含联盟、华为)
QUICKAPP-WEBVIEW-UNION 快应用联盟
QUICKAPP-WEBVIEW-HUAWEI 快应用华为

1.2.1. 支持的文件

(1).vue/.nvue/.uvue

(2).js/.uts

(3).css

(4)pages.json

(5)各预编译语言文件,如:.scss、.less、.stylus、.ts、.pug

1.3. 案例

1.3.1. 示例页面

javascript 复制代码
     <!-- h5显示 -->
	<!-- #ifdef H5 -->
	<view>H5</view>
	<!-- #endif -->
	
	<!-- 微信小程序显示 -->
	<!-- #ifdef MP-WEIXIN -->
	<view>小程序</view>
	<!-- #endif -->
	
	
	<!-- #ifndef H5 -->
	<view class="else">
		除了h5都展示
	</view>
	<!-- #endif -->

1.3.2. 示例方法

javascript 复制代码
	onLoad() {
			// #ifdef H5
			console.log('H5')
			// #endif
			// #ifdef MP-WEIXIN
			console.log('小程序')
			// #endif
		}
相关推荐
Javashop_jjj1 小时前
三勾软件| 用SpringBoot+Element-UI+UniApp+Redis+MySQL打造的点餐连锁系统
spring boot·ui·uni-app
Q_Q5110082858 小时前
python+uniapp基于微信小程序的心理咨询信息系统
spring boot·python·微信小程序·django·flask·uni-app·node.js
HuYi_code9 小时前
WeChat 小程序下载文件实现
微信小程序·uni-app
00后程序员张10 小时前
HTTPS 包 抓取与分析实战,从抓包到解密、故障定位与真机取证
网络协议·http·ios·小程序·https·uni-app·iphone
2501_9159214310 小时前
iOS混淆与IPA加固实战手记,如何构建苹果应用防反编译体系
android·macos·ios·小程序·uni-app·cocoa·iphone
Q_Q51100828513 小时前
python+uniapp基于微信小程序的学院设备报修系统
spring boot·python·微信小程序·django·flask·uni-app
ღ᭄ꦿ࿐Never say never꧂15 小时前
微信小程序 Button 组件 open-type 完全指南:从用户信息获取到客服分享的实战应用
spring boot·微信小程序·小程序·uni-app·vue3
你真的可爱呀16 小时前
uniapp学习【路由跳转 +数据请求+本地存储+常用组件】
前端·学习·uni-app
2501_915106321 天前
iOS 26 APP 性能测试实战攻略:多工具组合辅助方案
android·macos·ios·小程序·uni-app·cocoa·iphone
00后程序员张1 天前
iOS混淆与IPA文件加固全流程实战 防止苹果应用被反编译的工程级方案
android·ios·小程序·https·uni-app·iphone·webview