uniapp 为何能跨端？

uni-app在跨平台的过程中，不牺牲平台特色，不限制平台的能力使用。

应用开发中，90%的常规开发，比如界面组件、联网等api，uni-app封装为可跨多端的API。

除了 uni-app 框架内置的跨端 API，各端自己的特色 API 也可通过条件编译自由使用

uniapp将常用的组件和API进行了跨平台封装，可覆盖大部分的业务需求。

下图是uni-app产品功能框架图

uni-app组成和跨端原理

uni-app能实现一套代码、多端运行，是通过这2部分配合完成的

uni-app分编译器和运行时（runtime）

编译器

• 编译器运行在电脑开发环境。一般是内置在HBuilderX工具中，也可以使用独立的cli版。
• 开发者按uni-app规范编写代码，由编译器将开发者的代码编译生成每个平台支持的特有代码
  • 在web平台，将.vue文件编译为js代码。与普通的vue cli项目类似
  • 在微信小程序平台，编译器将.vue文件拆分生成wxml、wxss、js等代码
  • 在app平台，将.vue文件编译为js代码。进一步，如果涉及uts代码：
    • 在Android平台，将.uts文件编译为kotlin代码
    • 在iOS平台，将.uts文件编译为swift代码
• 编译器分vue2版和vue3版
  • vue2版：基于wepback实现
  • vue3版：基于Vite实现。性能更快
• 编译器支持条件编译，即可以指定某部分代码只编译到特定的终端平台。从而将公用和个性化融合在一个工程中。

 

运行时（runtime）

runtime不是运行在电脑开发环境，而是运行在真正的终端上。

uni-app runtime包括3部分：基础框架、组件、API。

基础框架：

• 包括语法、数据驱动、全局文件、应用管理、页面管理、js引擎、渲染和排版引擎等

组件：

• runtime中包括的组件只有基础组件，如<view>、<button>等。扩展组件不包含在uni-app的runtime中，而是下载到用户的项目代码中。

API：

• uni-app runtime内置了大量常见的、跨端的 API，比如联网(uni.request)、读取存储(uni.getStorage)。
• 同时uni-app不限制各端原生平台的API调用。开发者可以在uni-app框架中无限制的调用该平台所有能使用的API。