详解 Weex 页面的渲染过程

这篇文章介绍了一个 Weex 页面的渲染过程，涉及很多框架内部的细节。

“哟”

在线例子，使用 Weex Playground 扫码即可预览。

这是一个使用 Vue.js 2.x 语法写的一个小例子，极其简单，就一个字，可以借助 Weex 在移动端中渲染生成原生组件。

这也是实现文字水平垂直居中的最简例子。

源代码

组件代码：

除了组件代码以外，还需要一个入口文件指定挂载点并触发渲染：

// entry.js
import Vue from 'vue'
import Yo from 'yo.vue'

Yo.el = '#root'
new Vue(Yo)

编译

.vue 文件是无法被直接执行的，必须要编译成 .js 格式的文件才可以被 Web 或 Weex 平台执行。

.vue 文件通常可以分为三部分：