Error in nextTick: "TypeError: Cannot read property 'appendChild' of null"

[limsocheat]

I try to use vuetify-loading-overlay in Laravel & VueJS.

`import {LoadingPlugin} from "vuetify-loading-overlay"
Vue.use(LoadingPlugin, {
//props
spinnerProps: {},
overlayProps: {},
});

new Vue({
vuetify,
render: h => h(App, {
props: {
initialPage: JSON.parse(el.dataset.page),
resolveComponent: name => import(./Pages/${name})
.then(({ default: page }) => {
page.layout = page.layout === undefined ? Layout : page.layout
return page
}),
},
}),
wait: new VueWait(),
}).$mount(el)`

below is the error:

`[Vue warn]: Error in nextTick: "TypeError: Cannot read property 'appendChild' of null"

(found in )
warn @ app.js:48835
logError @ app.js:50094
globalHandleError @ app.js:50089
handleError @ app.js:50049
(anonymous) @ app.js:50192
flushCallbacks @ app.js:50116
Promise.then (async)
timerFunc @ app.js:50143
nextTick @ app.js:50200
Vue.$nextTick @ app.js:51725
beforeMount @ app.js:46193
invokeWithErrorHandling @ app.js:50064
callHook @ app.js:52421
mountComponent @ app.js:52245
./node_modules/vue/dist/vue.common.dev.js.Vue.$mount @ app.js:57245
./node_modules/vue/dist/vue.common.dev.js.Vue.$mount @ app.js:60145
Vue._init @ app.js:53213
VueComponent @ app.js:53348
Loading @ app.js:60290
install @ app.js:60318
Vue.use @ app.js:53301
./resources/js/app.js @ app.js:106325
webpack_require @ app.js:833
fn @ app.js:130
0 @ app.js:106447
webpack_require @ app.js:833
(anonymous) @ app.js:971
(anonymous) @ app.js:974
app.js:50098 TypeError: Cannot read property 'appendChild' of null
at VueComponent. (app.js:46194)
at Array. (app.js:50190)
at flushCallbacks (app.js:50116)`

[wimil]

please tell me the version of vue you are using.

[limsocheat]

Hi, That issue occurs when using Laravel InerjaJs.

However, there is another console (on app first start) when use with NuxtJS SSR
Vue Warn: Error in created hook (Promise/async): "TypeError: Cannot read property 'show' of undefined"

found in

---> <Pages/project/Projectuuid/reports/profitLoss.vue> at pages/project/_projectuuid/reports/profit_loss.vue
       <Pages/project/Projectuuid/reports.vue> at pages/project/_projectuuid/reports.vue
         <Nuxt>
           <VMain>
             <VApp>
               <Layouts/default.vue> at layouts/default.vue
                 <Root>


 ERROR  Cannot read property 'show' of undefined                                                          17:12:03

  at VueComponent.getItem (pages/project/_projectuuid/reports/profit_loss.js:179:22)
  at VueComponent.created (pages/project/_projectuuid/reports/profit_loss.js:204:16)
  at invokeWithErrorHandling (node_modules/vue/dist/vue.runtime.common.dev.js:1850:57)
  at callHook (node_modules/vue/dist/vue.runtime.common.dev.js:4207:7)
  at VueComponent.Vue._init (node_modules/vue/dist/vue.runtime.common.dev.js:4989:5)
  at new VueComponent (node_modules/vue/dist/vue.runtime.common.dev.js:5134:12)
  at createComponentInstanceForVnode (node_modules/vue-server-renderer/build.dev.js:8184:10)
  at renderComponentInner (node_modules/vue-server-renderer/build.dev.js:8408:40)
  at renderComponent (node_modules/vue-server-renderer/build.dev.js:8383:5)
  at renderNode (node_modules/vue-server-renderer/build.dev.js:8294:5)

[FreezeNow]

I had this problem too, I looked at the wrong location and found that it was because I set the id of the v-app to main instead of app.