vue系列文章 — 源码目录结构整理(三)

vue的版本是:^2.6.10

结构如下:

如上是 vue2.6.10版本所有的js目录结构

1. src/compiler: 该目录包含Vue.js所有编译相关的代码,包括把模板解析成AST语法树、及 AST语法树优化、代码生成等功能。

src/compiler/codegen: 把AST转换成Render函数。
src/compiler/parser: 解析模板成AST。
src/compiler/directives: 生成 Render 函数之前需要处理的指令。

2. src/core: 该目录包含了Vue.js的核心代码,包括内置组件、全局API封装、Vue实列化、观察者、虚拟DOM、工具函数等。

src/core/components: 组件相关的属性,目前这里只有keep-alive组件
src/core/global-api: Vue的全局api, 比如 Vue.extend、Vue.mixin.

src/core/instance: 实例化相关的。比如 生命周期、事件等。
src/core/observer: Vue响应式数据相关的目录。
src/core/util: Vue相关的工具方法目录。
src/core/vdom: 虚拟dom相关的内容。

3. src/platforms: platforms 是Vue.js的入口文件,有2个入口文件 web 和 weex,分别打包运行在 web或 weex 平台上的。

src/platforms/web 平台上的(src/platforms/weex 也是一样的意思)。
src/platforms/web/compiler: web端编译器相关的代码,用来编译模板成Render函数。
src/platforms/web/runtime: web端运行时相关的代码,用来创建Vue实列等操作。
src/platforms/web/util: 相关工具类。
src/platforms/web/server: 服务器端渲染相关的。

4. src/server: Vue2.0+ 为了支持服务器端渲染,所有服务器端渲染相关的逻辑都放在这个目录下。

5. src/sfc: 该目录下的代码逻辑会把 .vue 文件内容解析成一个 javascript 的对象。

src/sfc/parser.js: 转换单文件组件(*.vue) 解析成一个javascript对象。

6. src/shared: 该目录下会定义一些工具方法。这些工具方法会被浏览器端 Vue.js 和 服务器端 Vue.js所共享的。

Original: https://www.cnblogs.com/tugenhua0707/p/11756575.html
Author: 龙恩0707
Title: vue系列文章 — 源码目录结构整理(三)

原创文章受到原创版权保护。转载请注明出处:https://www.johngo689.com/553778/

转载文章受原作者版权保护。转载请注明原作者出处!

(0)

大家都在看

亲爱的 Coder【最近整理,可免费获取】👉 最新必读书单  | 👏 面试题下载  | 🌎 免费的AI知识星球