weex 源码目录说明

weex-vue-framework

weex-vue-framework-directory.png

frameworks

驱动 weex 的 framework 代码,

  • legacy: weex 在使用 vue 之前的 代码
  • vanilla:

Vanilla JS 是一个快速、轻量级和跨平台的框架用来构建强大的 JavaScript 应用程序。
JavaScript 框架,weex 版本里面没有实现。

目前版本打包好的 framework 有四个,在 index.js 中看到,

import * as Vanilla from './vanilla/index'
import * as Vue from 'weex-vue-framework'
import * as Weex from './legacy/index'
import Rax from 'weex-rax-framework'

export default {
  Vanilla,
  Vue,
  Rax,
  Weex
}
  • weex-vue-framework: 就是 vue 驱动 weex 的 framework,源码字 vue 仓库。

  • rax :容器

render

渲染引擎

1、 native:

native 上的 weex 渲染引擎, 这里只是初始化入口,源文件: html5/frameworks/legacy,这个也是 在.we 使用的
framework,vue2.0 使用的 是 node_modules/weex_vue_framework/。

2、 weex-web-render

web 平台 weex 渲染引擎, .we 在 web 平台使用的 framework。

3、 weex-vue-render

web 平台 vue weex 的组件库

runtime

关键代码,
1、初始化 framework
2、负责和 native 交互
3、vdom,定义 dom 节点,各个 framework 都是 适配这个 来驱动 weex。
4、注册 组件 和 module

1、vdom

定义 dom 节点,各个 framework 都是 适配这个 来驱动 weex。

2、init.js

初始化 方法, 初始化 framework,createInstance,createServices

3、task-center

vdom 和 native 交互的代码

4、config

将 Document,Element,Comment,Listener,TaskCenter,sendTasks 封装到一个对象,传入 framework 使用。

5、callback-manager

callback 管理类。js 调用 native 时,如果需要回调,则回调方法会暂时存放在 这里,
native 调用 callback 回调时,vue-framework 的 callback 方法会调用 task-center 中的 callback,
这时候就从callback-manager 中取出对应的 callback 执行。

4、listener

weex 1.0 时代 的方法,现在已废弃。

5、handler

Listener 对象的 handler,也是废弃的。

services

1、broadcast-channel

全局广播(才有 vue 之后,也废弃了)

shared

公用代码

vue

vue 源码在 这里

vue-framework-directory.png

src/core

里面都是 vue 的核心代码,渲染算法,vdom ,数据绑定 等等都在这里,

  1. components
  2. global-api
  3. instance
  4. observer
  5. util
  6. vdom

platforms/web

web 平台 入口

platforms/weex

weex 平台 入口

1.runtime

定义的 组件,模块,初始化 Vue的入口。

  1. components

  2. directives

  3. modules

  4. node-ops.js

操作 node 的类。vue 核心库中会调用 操作 node 会调用这里的方法,通过这个 node-ops 再把消息传递到 weex 中。

  1. patch.js

封装 node-opsmodules ,传递到 vue/core 中

  1. text-node.js

文本节点。

2. util
3. entry-compiler.js

weex-vue build入口

4. entry-framework.js

weex 平台

5. entry-runtime-factory.js

vue 核心库的入口

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 引子 这篇文章是笔者近期关于Weex在iOS端的一些研究和实践心得,和大家一起分享分享,也算是对学习成果的总结。文...
    一缕殇流化隐半边冰霜阅读 12,160评论 53 165
  • 2016年4月21日,阿里巴巴在Qcon大会上宣布开源跨平台移动开发工具Weex,Weex能够完美兼顾性能与动态性...
    晴天咚咚阅读 2,918评论 1 15
  • Situation 2018-03-15公众号《移动开发前线》发布了一篇文章。讲述了《移动开发前线》将与《前端之巅...
    曹俊_413f阅读 1,231评论 0 9
  • 最近研究了下React Native 与 Weex , 整理了份对比~ 最终选择的阿里霸霸的Weex! 本文主要是...
    ErHu丶阅读 5,913评论 3 17
  • 悄悄悄悄 没有一点声息 默默默默 失去所有兴趣 流光溢彩也了然无味 生活的印记 呵,是生活的反击 焦躁又生气? 只...
    拥有小太阳阅读 185评论 0 1