When using serializer.types, resolveComponent does not work and instead components have to be manually imported

Version

module: 1.4.1 nuxt: 3-rc.11

When using the serializer, based on the docs, it seems the following should be possible:

<template>
  <SanityContent :blocks="content" :serializers="serializers"/>
</template>

<script setup>
import { resolveComponent } from 'vue'
  const props = defineProps({
    content:{required:true,type:Array}
  })

  const serializers = {
    types: {
      youtube:resolveComponent('YoutubeVideo'),
      gallery:resolveComponent('Gallery')
    },
  }
</script>

However, it returns the following error:

Failed to resolve component: Gallery
If this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement. 

The only way I have managed to get this to work, is by importing the component manually, like so:

<template>
  <SanityContent :blocks="content" :serializers="serializers"/>
</template>


<script setup>
  import YoutubeVideo from '~/components/YoutubeVideo.vue'
  import Gallery from '~/components/Gallery.vue'


  const props = defineProps({
    content:{required:true,type:Array}
  })

  const serializers = {
    types: {
      youtube:YoutubeVideo,
      gallery:Gallery
    },
    marks: {
      // You can also just pass a string for a custom serializer if it's an HTML element
      internalLink: 'a'
    }
  }
</script>

[pascalwengerter]

@danielroe would you mind keeping this issue open? At least @toddpadwick and me tried using the docs in their current form and ended up having problems, I suppose there’s some potential in being more clear on the different ways/use cases 😃

[danielroe]

If Nuxt can’t know at build time which components you need, then you should mark them as global so they will all be built and available at runtime.