new Vue({...}) で起こることについてはhttps://github.com/vuejs/vue/blob/v2.6.11/dist/vue.js#L5073-L5079を見るのが素直かもしれない。
https://github.com/vuejs/vue/blob/v2.6.11/dist/vue.js#L5081で準備済みの Vue.prototype._init が実行される。→ https://github.com/vuejs/vue/blob/v2.6.11/dist/vue.js#L4961-L5014
callHook についてはvue/vue.js at v2.6.11 · vuejs/vue · GitHubより、イベントハンドラの実行のようである。これを踏まえると
initLifecycle実行initEvents実行initRender実行beforeCreateハンドラ実行initInjections実行initState実行initProvide実行createdハンドラ実行if (vm.$options.el) { vm.$mount(vm.$options.el); }実行
となる。つまり new Vue({el: "#app", ...}) とかの場合、その #app をもって Vue.prototype.$mount が実行されますと。
Vue.prototype.$mount の定義はhttps://github.com/vuejs/vue/blob/v2.6.11/dist/vue.js#L9039-L9045で、https://github.com/vuejs/vue/blob/v2.6.11/dist/vue.js#L4018-L4090の mountComponent の呼び出しに繋がる。ここでは
render関数の存在がチェックされて、存在しないならcreateEmptyVNodeが仮のrender関数に設定され、- 次に
new Vue({template: "<div>...</div>", ...})みたいにtemplateの存在がチェックされる。render関数もtemplateもないのはダメっぽい。
- 次に
- 次に
beforeMountハンドラが実行される。 Watcherとかいう「必要に応じてコールバックを実行する」仕組みを使って、updateComponent内部関数が実行され、その中でVue.prototype._renderが実行される。mountedハンドラ実行
となるようだ。
Vue.prototype._render の定義はhttps://github.com/vuejs/vue/blob/v2.6.11/dist/vue.js#L3527-L3589で、いわゆる render 関数、つまり new Vue({ render: function(createElement) {...} }) の部分が実行されて、vnode が作成される。
render 関数の引数 createElement の実体はhttps://github.com/vuejs/vue/blob/v2.6.11/dist/vue.js#L3500で、https://github.com/vuejs/vue/blob/v2.6.11/dist/vue.js#L3344-L3361の createElement 関数を呼び出す(ややこしい)。これは直下で定義されている _createElement 関数を呼び出す。tag に応じた VNode が作成される。
render 関数で作成された VNode はhttps://github.com/vuejs/vue/blob/v2.6.11/dist/vue.js#L3936-L3965の Vue.prototype._update に渡される。そして、https://github.com/vuejs/vue/blob/v2.6.11/dist/vue.js#L9036の Vue.prototype.__patch__ として patch 関数が呼ばれる。その実体は・・・たぶんhttps://github.com/vuejs/vue/blob/v2.6.11/dist/vue.js#L8449 の createPatchFunction 関数が作成して返す関数であり、https://github.com/vuejs/vue/blob/v2.6.11/dist/vue.js#L5845-L6561を見る限りでは最終的にはhttps://github.com/vuejs/vue/blob/v2.6.11/dist/vue.js#L6458-L6560という関数である。
