vue-component-meta queries

[jd-solanki]

Hi 👋🏻
I am building Anu. I want to render the API table at the end of component demos.

I used vue-component-meta but I have few queries with it:

1. Is it still WIP?
2. Does it work with .tsx components?
3. It includes ref_for & ref_key as props, can we exclude them & how?
4. I always get slots as empty: slots: [], (This is same for events)
5. I see there's description property on listed props, so how can I add description in my code so that I can get it via vue-component-meta

Regards.

[johnsoncodehk]

1. It's launch.
2. Yes.
3. You can filter it by check global property: https://github.com/johnsoncodehk/volar/blob/2758510a8e519563f16ce023c700ab98b8b65ad8/packages/vue-component-meta/tests/index.spec.ts#L20
4. The component should have $slots, $emit type. (https://github.com/johnsoncodehk/volar/blob/master/packages/vue-test-workspace/vue-component-meta/class-slots/component.vue) If component write by script setup, volar code gen will auto expose slots type from template.
5. You can wirte JSDoc to props: https://github.com/johnsoncodehk/volar/blob/2758510a8e519563f16ce023c700ab98b8b65ad8/packages/vue-test-workspace/vue-component-meta/reference-type-props/my-props.ts#L2-L4

[jd-solanki]

I will give it a try and will let you know if something goes wrong.

Thanks for this useful package ❤️

[jd-solanki]

Just a quick question, I have defineCompoent with .tsx extension and using setup function and there's no slots or $slots property 🤔

[johnsoncodehk]

@jd-solanki Yes defineComponent dons't have it, it's still in vue RFC(vuejs/rfcs#192). You need to shims the expose type you self.

const Component = defineComponent({ ... });
export default Component as typeof Component & new () {
	$slots: { ... }
}

[jd-solanki]

Hi @johnsoncodehk

It is really awesome ❤️

Here's what I have achieved so far:

However, Does it parse the code statically? Because it can't generate accurate data for variant, states & color prop:

• useProps composable
• useProps usage