vue-3

1-9 从入口开始

分析 Runtime+Compiler 的构建代码。
1.入口文件是 src/platforms/web/entry-runtime-with-complier.js 。这里给Vue的prototype上绑定了一个和编译器相关的方法是$mount。
2.然后src/platforms/web/entry-runtime-with-complier.js文件中的Vue其实来自于./runtime/index里面。这里面给Vue定义了很多静态的全局配置、patch、$mount方法。
3.然后./runtime/index中的Vue来自于core/index。
在这里执行了初始化全局API的动作：initGlobalAPI(API)（给Vue挂载了很多静态方法）、等操作。
4.在./runtime/index中的Vue又来自于./instance/index。至此我们就已经看到了Vue的庐山真面目，他其实是用function实现的一个类。之所以使用function没有直接用ES6的类，是因为构造函数有原型链这样的特点，但是如果用class去实现这个效果的话就很难了。
其实我们从./instance.js/index中就可以看到执行了很多MIxin：

initMixin(Vue)
stateMixin(Vue)
eventsMixin(Vue)
lifecycleMixin(Vue)
renderMixin(Vue)

这里的每一个Mixin都是给Vue的原型上绑定了很多方法。

• initMixin其实就是给原型上挂载了Vue.prototype._init方法
• stateMixin挂载了Vue.prototype.$set、Vue.prototype.$delete、Vue.prototype.$watch
• eventsMixin挂载了Vue.prototype.$on、Vue.prototype.$off、Vue.prototype.$once、Vue.prototype.$emit
• lifecycleMixin挂载了 Vue.prototype._update、Vue.prototype.$forceUpdate、Vue.prototype.$destroy、
• renderMixin挂载了Vue.prototype.$nextTick、Vue.prototype._render