肉烂在锅里

个人站

我是软件研发中心培训主管,我喜欢看动漫,学习web前端开发。


Vue源码分析(一)从入口开始

Vue源码分析(一)从入口开始

这一部分主要研究了import Vue from vue 的过程:

Import Vue from vue这一行代码无非就是引入Vue模块,而这个模块正是Vue这个全局对象。

Vue的入口是在这里:

src/platforms/web/entry-runtime-with-compiler.js

在这个文件中,我们发现又引入了Vue

说明Vue这个全局对象的初始化并不是一步到位,而是多个文件配合组成的。

在当前的文件中,是为Vue绑定了一些诸如Vue.prototype.$mount、$options等继承方法和属性。

然后进入./runtime/index:

然后又会发现这个文件还不是Vue的最初配置,在这个文件中又引入了Vue

在当前的文件中是给Vue定义了一些全局配置和一些Vue.prototype上的方法。只是为Vue这个对象做一些扩展,不是很重要,可以先不要。

最关键的是这里:import Vue from ‘core/index’

在src/core/index.js中:

在这个js文件中,依旧不是import Vue的终点:

他初始化了一些全局的静态方法

同时为Vue.prototype上又定义了一些访问器属性。重点是他在这里初始化了一些全局的静态方法。

进入./instance/index,这里才是Vue初始化的终点。

用这句话来十分巧妙的判断了当前是否有使用new操作符。

然后通过下面这几个方法来按类型为Vue继续添加一些重要的继承属性和方法,比如生命周期。

打赏一个呗

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码支持
扫码打赏,你说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦