Empty meta data

[BlueBazze]

It seems that all meta data for all my components are empty. Haven't been able to find a solution for this.

Versions

{
  "nuxt": "^3.11.2",
  "nuxt-component-meta": "^0.6.4"
}

components/test.global.vue

<script lang="ts" setup>
defineProps<{hello: string}>()

</script>

<template>
  <div style="background-color: red;">
    <slot />
  </div>
</template>

.nuxt/components-meta.mjs

  "Test": {
    "mode": "all",
    "global": true,
    "prefetch": false,
    "preload": false,
    "filePath": "components/test.global.vue",
    "pascalName": "Test",
    "kebabName": "test",
    "chunkName": "components/test",
    "shortPath": "components/test.global.vue",
    "export": "default",
    "priority": 1,
    "fullPath": "/my_nuxt_app_absolute_path/components/test.global.vue",
    "meta": {
      "type": null,
      "props": [],
      "slots": [],
      "events": [],
      "exposed": []
    }
  }

When i try to log this line in my node_modules, it seems to return an empty array.

Tried defining the props in the different ways, but to no avail. I've checked the checker, and the component is present in the tsconfig.

Tried manually installing the latest version of vue-component-meta - 2.0.19 Now it works, except for updateOutput. It fails on https://github.com/nuxtlabs/nuxt-component-meta/blob/main/src/parser.ts#L115-L119 After the writeFile is called, memory usage goes up by about 2.5 GB then throws Javascript heap out of memory. I am able to console log all the writeFile params, and they seem alright. Tested on node 22.1.0 22.2.0 20.14.0 It works fine if i make it print JSON.stringify(components["Test"])

Well..... It seems fair.. Had a feeling that it was generating a lot of text.. So i tried

    await writeFile(path, "export default {\n", "utf-8");
    const cc = Object.entries(components)

    for (const [key, value] of cc) {

      await appendFile(path, `${key}: ${JSON.stringify(value)},\n`, 'utf-8' )
    }

    await appendFile(path, "\n}", 'utf-8' )

Instead of writeFile. After taking a look at the file, it is now 210 mb before going out of heap.

After updating the printing

    Object.keys(components).forEach(component => {
      writeFileSync(join(dirname(path), "components", components[component].pascalName + ".json"), JSON.stringify(components[component], null, 2), 'utf-8')
    })

There is a total of 2 GB of json files.

[trc-mathieu]

@BlueBazze I was experiencing the same issue as you (empty meta) and just figured it out. For me, some components were working and some were not. vue-component-meta doesn't support slots with empty params, this issue was fixed in https://github.com/vuejs/language-tools/pull/4093

I'm not too sure if there are breaking changes but I now override the vue-component-meta to use their latest version 2.0.19 like you did and it works.

For your heap memory issue, idk but have you tried to exclude components from other modules that you don't need their meta information?

'componentMeta': {
    exclude: [
      '@nuxt/content',
      '@nuxt/ui-templates',
      '@nuxt/ui',
      '@nuxt/ui-pro',
      '@nuxtjs/color-mode',
      ...

[BlueBazze]

I have a layer with shadcn-vue which is built on top of radix-vue. Radix uses some deep typed props, sometimes even includes HTMLElement. vue-component-meta then maps out all the types which causes some component meta's to be hundreds of MB.

Noticed the exclude allowed for a function to filter instead of the string regex. (component: any) => !component.pascalName.startsWith("Prose")

---

The root of the issue is whenever the components meta data gets too big node has a problem writing the data to a file. Along with the outdated vue-component-meta.