vue源码分析笔记(01)—vue的入口

一直停留在会用vue的层面,从今天开始研究vue源码,做一个懂原理的人。

vue版本:^2.5.2

源文件入口:\node_modules\vue\src\core\index.js
vue源码分析笔记(01)—vue的入口_第1张图片
大多数注解笔记在源码中已经注释好了。
注意一下第8行,这个FunctionalRenderContext不知道是干嘛的,但是可以从第26行的作者注释看出,这就是为服务端渲染安装的一个东西,我现在将他看作一个证书,应该可以先不用管。
接着往下走,去看看\node_modules\vue\src\core\instance\index.js这个为vue初始化的文件中有些什么东西。
vue源码分析笔记(01)—vue的入口_第2张图片
从第23行至第27行可以看出,这应该是往vue对象上挂载一些属性和方法,具体的哪个文件挂载了哪些方法大家可以去看看,我已经给大家整理整理出来了,大家可以去验证一下,例如,stateMixin,我们可以从state.js文件中找到:
vue源码分析笔记(01)—vue的入口_第3张图片
传入一个对象,也就是instance\index.js中传进来的Vue对象。
挂载了:$data, $props, $set, $delete, $watch。
看下作者的注释说了些什么,大意是,因为Object.defineProperty()存在一些缺陷,所以这边手动重构了dataDef和propsDef对象,具体的可以浏览简书的一篇文章:深入浅出Object.defineProperty()
其他的大家可以对照这种方法去找找,我用的是2.5.2的版本,如有差异,可能是版本不同引起的。

这篇文章就分析了一下vue初始化的时候一些东西,下一篇我们去看看作者给我们挂载了哪些全局的API。

本内容全属个人研究,如有错误之处,敬请指出。

你可能感兴趣的:(vue源码分析)