My browser is not rendering the Nuxt3 Headless UI.

[jimb6]

Hello everyone, I'm having some difficulties with my headless UI that aren't showing up in my browser. I attempted to install @headlessui/vue@insiders and include it in nuxt.config.ts.

nuxt.config.ts and index.vue File.

// https://v3.nuxtjs.org/api/configuration/nuxt.config
export default defineNuxtConfig({
    buildModules: [
    ],
    build: {
        transpile: ['@headlessui/vue']
    }
})



<template>
  <div>
    <Menu>
      <MenuButton>More</MenuButton>
      <MenuItems>
        <MenuItem v-slot="{ active }">
          <a :class='{ "bg-blue-500": active }' href="/account-settings">
            Account settings
          </a>
        </MenuItem>
        <MenuItem v-slot="{ active }">
          <a :class='{ "bg-blue-500": active }' href="/account-settings">
            Documentation
          </a>
        </MenuItem>
        <MenuItem disabled>
          <span class="opacity-75">Invite a friend (coming soon!)</span>
        </MenuItem>
      </MenuItems>
    </Menu>
  </div>
</template>

<script setup>
import { Menu, MenuButton, MenuItems, MenuItem } from '@headlessui/vue'

</script>

<style scoped>

</style>