前言
纯官网介绍,我觉得有价值就记录下来了,方便后续查找
一、编译器
uni-app能实现一套代码、多端运行,核心是通过编译器 + 运行时实现的
编译器:将uni-app统一代码编译生成每个平台支持的特有代码;如在小程序平台,编译器将.vue文件拆分生成wxml、wxss、js等代码
运行时:动态处理数据绑定、事件代理,保证Vue和平台宿主数据的一致性
二、编译器使用
根据创建方式,编译器在使用上也有差异
- cli 方式创建的项目,编译器安装在项目下。编译器不会跟随HBuilderX升级
- HBuilderX可视化界面创建的项目,编译器在HBuilderX的安装目录下的plugin目录,随着HBuilderX的升级会自动升级编译器。
- 已经使用cli创建的项目,如果想继续在HBuilderX里使用,可以把工程拖到HBuilderX中。注意如果是把整个项目拖入HBuilderX,则编译时走的是项目下的编译器。如果是把src目录拖入到HBuilderX中,则走的是HBuilderX安装目录下plugin目录下的编译器
三、条件编译
条件编译是用特殊的注释作为标记,在编译时根据这些特殊的注释,将注释里面的代码编译到不同平台
写法:以 #ifdef 或 #ifndef 加 %PLATFORM% 开头,以 #endif 结尾。
- #ifdef:if defined 仅在某平台存在
- #ifndef:if not defined 除了某平台均存在
- %PLATFORM%:平台名称
例如:
#ifdef H5 || MP-WEIXIN
需条件编译的代码
#endif
在 H5 平台或微信小程序平台存在的代码(这里只有||,不可能出现&&,因为没有交集)
%PLATFORM%的取值看官网介绍
各种条件编译
注意注释的写法不同
- API的条件编译
// #ifdef %PLATFORM%
平台特有的API实现
// #endif
- 组件的条件编译
<!-- #ifdef %PLATFORM% -->
平台特有的组件
<!-- #endif -->
- 样式的条件编译
/* #ifdef %PLATFORM% */
平台特有样式
/* #endif */