fix(nuxt3): prevent removing and re-adding tags before mount (nuxt#3212)

Co-authored-by: pooya parsa <pyapar@gmail.com>
cexbrayat · Feb 15, 2022 · ef69e74 · ef69e74
1 parent 6a93719
commit ef69e74
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 5 deletions.
diff --git a/packages/bridge/src/runtime/app.plugin.mjs b/packages/bridge/src/runtime/app.plugin.mjs
@@ -77,5 +77,11 @@ export default (ctx, inject) => {
 
   setNuxtAppInstance(proxiedApp)
 
+  if (process.client) {
+    window.onNuxtReady(() => {
+      nuxtApp.hooks.callHook('app:mounted', nuxtApp.vueApp)
+    })
+  }
+
   inject('_nuxtApp', proxiedApp)
 }
diff --git a/packages/nuxt3/src/meta/runtime/lib/vueuse-head.plugin.ts b/packages/nuxt3/src/meta/runtime/lib/vueuse-head.plugin.ts
@@ -7,23 +7,19 @@ export default defineNuxtPlugin((nuxtApp) => {
   const head = createHead()
 
   nuxtApp.vueApp.use(head)
+  nuxtApp.hooks.hookOnce('app:mounted', () => { watchEffect(() => head.updateDOM()) })
 
   nuxtApp._useMeta = (meta: MetaObject) => {
     const headObj = ref(meta as any)
     head.addHeadObjs(headObj)
 
     if (process.server) { return }
 
-    watchEffect(() => {
-      head.updateDOM()
-    })
-
     const vm = getCurrentInstance()
     if (!vm) { return }
 
     onBeforeUnmount(() => {
       head.removeHeadObjs(headObj)
-      head.updateDOM()
     })
   }