回至v3.0.0-beta.1
v3.0.0,2020-9-18发布。这篇文章2020-5-31号发布。版本还是晚了。
v3.0.0-beta.1,2020-4-17,差不多。
- ref-transform/package.json在v3.2.4版本新增
- sfc-playground/package.json 在v3.0.0-beta.5新增
- vue-compat/package.json 在v3.0.0-alpha.1新增
复制到当前版本,设置命令"dev": "node scripts/dev.js -s"
npm run dev
再走脉络
| 文件位置 | 函数 | return |
|---|---|---|
| packages\runtime-dom\src\index.ts | createApp | app |
| packages\runtime-dom\src\index.ts | ensureRenderer | |
| 挂载reander函数 | ||
| packages\runtime-core\src\renderer.ts | createRenderer | |
| packages\runtime-core\src\renderer.ts | baseCreateRenderer | |
| 创建app,开始挂载 | ||
| packages\runtime-core\src\apiCreateApp.ts | createAppAPI | createApp |
| packages\runtime-core\src\apiCreateApp.ts | app.mount | proxy |
| packages\runtime-core\src\apiCreateApp.ts | createVNode | vnode |
| packages\runtime-core\src\vnode.ts | createVNode | |
| mount进入render | ||
| packages\runtime-core\src\renderer.ts | baseCreateRenderer.render | |
| packages\runtime-core\src\renderer.ts | baseCreateRenderer.patch | |
| packages\runtime-core\src\renderer.ts | baseCreateRenderer.processComponent | |
| packages\runtime-core\src\renderer.ts | baseCreateRenderer.mountComponent | |
| packages\runtime-core\src\renderer.ts | createComponentInstance | instance |
| 初始化data | ||
| packages\runtime-core\src\renderer.ts | setupComponent(instance) | |
| packages\runtime-core\src\component.ts | initProps(instance) | |
| packages\runtime-core\src\component.ts | initSlots(instance) | |
| packages\runtime-core\src\component.ts | setupStatefulComponent | |
instance.proxy = new Proxy(instance.ctx, PublicInstanceProxyHandlers) | ||
| packages\runtime-core\src\componentProxy.ts | PublicInstanceProxyHandlers | |
| packages\runtime-core\src\component.ts | finishComponentSetup | |
| packages\runtime-core\src\componentOptions.ts | applyOptions | |
callSyncHook('beforeCreate', options, publicThis, globalMixins) | beforeCreate | |
| packages\runtime-core\src\renderer.ts | setupRenderEffect |
PublicInstanceProxyHandlers
get
- accessCache记录类型,如果已经记录过就直接返回
- publicGetter记录属性,如果已经记录过就直接返回
set、has
普通返回
applyOptions
// packages\runtime-core\src\componentOptions.ts
export function applyOptions(
instance: ComponentInternalInstance,
options: ComponentOptions,
asMixin: boolean = false
) {
callSyncHook('beforeCreate', options, publicThis, globalMixins)
// global mixins are applied first
applyMixins(instance, globalMixins)
applyMixins(instance, mixins)
// 取出data对象
const data = dataOptions.call(publicThis, publicThis)
// 响应包裹
instance.data = reactive(data)
extend(instance.data, data)
}