SLOTS NOT WORKING AS EXPECTED

[favorodera]

Only the default slot displays when i make use of slots.

Nuxt Config:

// https://nuxt.com/docs/api/configuration/nuxt-config
export default defineNuxtConfig({
  modules: ['@unocss/nuxt', '@nuxt/eslint', '@nuxt/content', '@nuxthq/studio', '@nuxtjs/color-mode'],

  ssr: true,

  devtools: { enabled: false },

  app: {
    rootTag: 'main',
    rootAttrs: {
      id: 'app',
    },
  },

  css: ['~/assets/scss/index.scss'],

  colorMode: {
    preference: 'dark',
    fallback: 'dark',
    storage: 'localStorage',
    classSuffix: '',
    storageKey: 'color-mode',
  },

  content: {
    markdown: {
      mdc: true,
    },
  },

  compatibilityDate: '2024-04-03',

  eslint: {
    config: {
      stylistic: true,
    },
  },

  studio: {
    enabled: true,
  },

  unocss: {
    nuxtLayers: true,
  },
})

Component:

<!--~/components/content/Header.vue  -->

<template>
  <header>
    <slot name="address" />
    <slot name="mobile-number" />
    <slot name="email" />
  </header>
</template>

Markdown:

<!-- content/index.md -->

::header

Orlu, Imo, Nigeria.

#mobile
+234 803 000 0000
::