vue2与vue3源码解析对比——vue2目录(1)

542 阅读2分钟

源码目录

官方源码仓库github.com/vuejs/vue.g… vue源码都在src目录下,我们看下src的结构

src
--compiler  # 编译相关
--core      # 核心代码
--platforms # 不同平台的支持
--server    # 服务端渲染
--sfc       # .vue文件解析
--shared    # 共享代码

compiler

compiler目录包含Vue.js所有编译相关的代码,它包括把模版解析成ast语法树,ast语法树优化,代码生成等功能。

编译的工作可以在构建时做(借助webpack、vue-loader等辅助插件);也可以在运行时做,使用包含构建功能的Vue.js。显然,编译时一项耗性能的工作,所以更推荐前者————离线编译。

core

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

这里的代码是Vue.js的灵魂。

platform

Vue.js是一个跨平台的MVVM框架,它可以跑在web上,也可以配合weex跑在native客户端上。platform是Vue.js的入口,2个目录代表2个主要入口,分别打包成运行在web上和weex上的Vue.js。

一般我们使用的都是web入口打包的Vue.js。

server

Vue.js2.0支持了服务端渲染,所有服务端渲染相关的逻辑都在这个目录下。注意:这部分代码是跑在服务端的Node.js,不要和跑在浏览器端的Vue.js混为一谈。 服务端渲染主要的工作是把组件渲染为服务器端的HTML字符串,将它们直接发送到浏览器,最后将静态标记“混合”为客户端上完全交互的应用程序。

sfc

通常我们开发Vue.js都会借助webpack构建,然后通过.vue单文件的编写组件。 这个目录下的代码逻辑会把.vue文件内容解析成一个Javascript的对象。

shared

Vue.js会定义一些工具方法,这里定义的工具方法都是会被浏览器端的Vue.js和服务端的Vue.js所共享的。