1. 入口
相对路径为
/src
一般入口:platforms/web/entry-*.js
=> runtime/index
=> core/index
=> core/instance/index
1. 实例文件中各种mixin配置Vue原型,注册实例api
// core/instance/index
initMixin(Vue)
stateMixin(Vue)
eventsMixin(Vue)
lifecycleMixin(Vue)
renderMixin(Vue)
2. 核心入口 initGlobalAPI(Vue)
注册Vue全局API(静态方法),声明并挂载Vue.config
、Vue.util
、Vue.options
对象
3. 打包入口处挂载工具,注册内置指令、组件,注册实例$mount
// platforms/web/runtime/index
Vue.config.mustUseProp = mustUseProp
Vue.config.isReservedTag = isReservedTag
Vue.config.isReservedAttr = isReservedAttr
Vue.config.getTagNamespace = getTagNamespace
Vue.config.isUnknownElement = isUnknownElement
extend(Vue.options.directives, platformDirectives)
extend(Vue.options.components, platformComponents)
Vue.prototype.__patch__ = inBrowser ? patch : noop
Vue.prototype.$mount = function (el?: string | Element, hydrating?: boolean): Component {
el = el && inBrowser ? query(el) : undefined
return mountComponent(this, el, hydrating)
}
2. 实例mixin
1. initMixin
Vue.prototype._init
构造函数
2. stateMixin
-
注册引用
Vue.prototype.$data
getter =>_data
Vue.prototype.$props
getter =>_props
-
注册方法
Vue.prototype.$set
Vue.prototype.$delete
Vue.prototype.$watch
3. eventsMixin
Vue.prototype.$on
Vue.prototype.$once
Vue.prototype.$off
Vue.prototype.$emit
4. lifecycleMixin
Vue.prototype._update
Vue.prototype.$forceUpdate
Vue.prototype.$destroy
5. renderMixin
installRenderHelpers(Vue.prototype)
组测渲染工具
Vue.prototype.$nextTick
Vue.prototype._render
3. 注册全局API
1. initGlobalAPI()
Vue.config
getter => 预设config文件
Vue.util
= { warn, extend, mergeOptions, defineReactive }
Vue.set
Vue.delete
Vue.nextTick
Vue.observable
Vue.options
= Object.create(null)
Vue.options.components
= Object.create(null)
Vue.options.components.KeepAlive
Vue.options.directive
= Object.create(null)
Vue.options.filter
= Object.create(null)
Vue.options._base
= Vue
2. initUse
Vue.use
3. initMixin
Vue.mixin
4. initExtend
Vue.extend
Vue.cid
5. initAssetRegisters
Vue.component
Vue.directive
Vue.filter