fix(nuxt): name anonymous components in render tree (#10011)

nuxt · Jan 14, 2023 · 0db3c63 · 0db3c63
1 parent 488479a
commit 0db3c63
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 2 deletions.
diff --git a/packages/nuxt/src/app/components/layout.ts b/packages/nuxt/src/app/components/layout.ts
@@ -12,6 +12,7 @@ import { appLayoutTransition as defaultLayoutTransition } from '#build/nuxt.conf
 
 // TODO: revert back to defineAsyncComponent when https://github.com/vuejs/core/issues/6638 is resolved
 const LayoutLoader = defineComponent({
+  name: 'LayoutLoader',
   inheritAttrs: false,
   props: {
     name: String,
@@ -42,6 +43,7 @@ const LayoutLoader = defineComponent({
   }
 })
 export default defineComponent({
+  name: 'NuxtLayout',
   inheritAttrs: false,
   props: {
     name: {

diff --git a/packages/nuxt/src/app/components/utils.ts b/packages/nuxt/src/app/components/utils.ts
@@ -2,6 +2,7 @@ import { defineComponent, h } from 'vue'
 import type { Component } from 'vue'
 
 const Fragment = defineComponent({
+  name: 'FragmentWrapper',
   setup (_props, { slots }) {
     return () => slots.default?.()
   }

diff --git a/packages/nuxt/src/pages/runtime/page.ts b/packages/nuxt/src/pages/runtime/page.ts
@@ -56,7 +56,7 @@ export default defineComponent({
             wrapInKeepAlive(props.keepalive ?? routeProps.route.meta.keepalive ?? (defaultKeepaliveConfig as KeepAliveProps), h(Suspense, {
               onPending: () => nuxtApp.callHook('page:start', routeProps.Component),
               onResolve: () => { nextTick(() => nuxtApp.callHook('page:finish', routeProps.Component).finally(done)) }
-            }, { default: () => h(Component, { key, routeProps, pageKey: key, hasTransition } as {}) })
+            }, { default: () => h(RouteProvider, { key, routeProps, pageKey: key, hasTransition } as {}) })
             )).default()
         }
       })
@@ -84,7 +84,8 @@ function _mergeTransitionProps (routeProps: TransitionProps[]): TransitionProps
   return defu(..._props)
 }
 
-const Component = defineComponent({
+const RouteProvider = defineComponent({
+  name: 'RouteProvider',
   // TODO: Type props
   // eslint-disable-next-line vue/require-prop-types
   props: ['routeProps', 'pageKey', 'hasTransition'],