投稿者: vue3のmigration buildで色々対応中の時によくわからんエラーで詰まった時があった
vue.runtime.esm-bundler.js?1786:3167 Uncaught (in promise) TypeError: Cannot read properties of null (reading 'emitsOptions')
at shouldUpdateComponent (vue.runtime.esm-bundler.js?1786:3167:1)
at updateComponent (vue.runtime.esm-bundler.js?1786:8806:1)
at processComponent (vue.runtime.esm-bundler.js?1786:8756:1)
at patch (vue.runtime.esm-bundler.js?1786:8354:1)
at patchKeyedChildren (vue.runtime.esm-bundler.js?1786:9137:1)
at patchChildren (vue.runtime.esm-bundler.js?1786:9080:1)
at patchElement (vue.runtime.esm-bundler.js?1786:8574:1)
at processElement (vue.runtime.esm-bundler.js?1786:8434:1)
at patch (vue.runtime.esm-bundler.js?1786:8351:1)
at patchKeyedChildren (vue.runtime.esm-bundler.js?1786:9137:1)ググっても特に情報が無く、みんなよくわからんちんって感じのようだった
https://github.com/vuejs/core/issues/5184
https://forum.vuejs.org/t/emitsoptions-error-impossible-to-debug/125512
https://stackoverflow.com/questions/69566174/how-to-get-proper-detailed-debug-messages-in-vue-js
しかもこのエラーが出た時、複数コンポーネントがフリーズしてしまう。フォーラムにも書いてあるけど。
該当コンポーネントの見つけ方は気合だった
フリーズしたコンポーネントの親をさかのぼってコメントアウトしていく
とどっかでこのエラーが消えるタイミングがある
ので、そのへんでうまいことtemplateをいじって見つけ出しました
面白いことに、エラーが起きたコンポーネントの行を変えるとフリーズを最小限にできました
<div>
<ComponentA /><!-- error component -->
<ComponentB /><!-- freeze -->
<ComponentC /><!-- freeze -->
</div>↓順番を入れ替える↓
<div>
<ComponentB /><!-- healthy -->
<ComponentC /><!-- healthy -->
<ComponentA /><!-- error component -->
</div>自分の環境では、当該コンポーネントでVue3未対応のライブラリを使っていてフリーズしてしまうようでした
フォーラムにも書いてあるけどエラーが発生したコンポーネントが分かりにくいっすなぁ
追記
>当該コンポーネントでVue3未対応のライブラリを使っていて
これは誤りでした
ライブラリのコンポーネントが生成完了する前に利用したせいでおかしくなっていたようです(watcherとかで)
ライブラリがinitializeされてから操作すれば治りました🥳
 |
