Layer with Component Prefix

I am trying to append a prefix "Special" to the components that comes from the Layer. So that there is a clear difference between each of it. But when ever I use the component in the main app, it is not showing and gives this error. How can I fix this?

[Vue warn]: Failed to resolve component: SpecialLayerComponent
If this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement. 
  at <Index onVnodeUnmounted=fn<onVnodeUnmounted> ref=Ref< undefined > > 
  at <RouteProvider key="/" vnode= {__v_isVNode: true, __v_skip: true, type: {…}, props: {…}, key: null, …} route= {fullPath: '/', hash: '', query: {…}, name: 'index', path: '/', …}  ... > 
  at <RouterView name=undefined route=undefined > 
  at <NuxtPage> 
  at <App key=4 > 
  at <NuxtRoot>

Hydration completed but contains mismatches.

[Vue warn]: Failed to resolve component: SpecialLayerComponent
If this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement. 
  at <Index onVnodeUnmounted=fn<onVnodeUnmounted> ref=Ref< undefined > > 
  at <RouteProvider key="/" vnode= {__v_isVNode: true, __v_skip: true, type: {…}, props: {…}, key: null, …} route= {fullPath: '/', hash: '', query: {…}, name: 'index', path: '/', …}  ... > 
  at <RouterView name=undefined route=undefined > 
  at <NuxtPage> 
  at <App key=4 > 
  at <NuxtRoot>

Hydration completed but contains mismatches.

Image 01:- nuxt config of the application which is extended.

Image 02:- nuxt config of the main app

Image 03:- Using components from the groot layer in the main application.

Nuxt•12mo ago•

9 replies

Drom

Layer with Component Prefix

[Vue warn]: Failed to resolve component: SpecialLayerComponent
If this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement. 
  at <Index onVnodeUnmounted=fn<onVnodeUnmounted> ref=Ref< undefined > > 
  at <RouteProvider key="/" vnode= {__v_isVNode: true, __v_skip: true, type: {…}, props: {…}, key: null, …} route= {fullPath: '/', hash: '', query: {…}, name: 'index', path: '/', …}  ... > 
  at <RouterView name=undefined route=undefined > 
  at <NuxtPage> 
  at <App key=4 > 
  at <NuxtRoot>

Hydration completed but contains mismatches.

[Vue warn]: Failed to resolve component: SpecialLayerComponent
If this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement. 
  at <Index onVnodeUnmounted=fn<onVnodeUnmounted> ref=Ref< undefined > > 
  at <RouteProvider key="/" vnode= {__v_isVNode: true, __v_skip: true, type: {…}, props: {…}, key: null, …} route= {fullPath: '/', hash: '', query: {…}, name: 'index', path: '/', …}  ... > 
  at <RouterView name=undefined route=undefined > 
  at <NuxtPage> 
  at <App key=4 > 
  at <NuxtRoot>

Hydration completed but contains mismatches.

Image 01:- nuxt config of the application which is extended.

Image 02:- nuxt config of the main app

Image 03:- Using components from the groot layer in the main application.

Layer with Component Prefix

Similar Threads

Layer with Component Prefix

Similar Threads

Similar Threads

Similar Threads