Expose types of locally registered components

[gertqin]

What problem does this feature solve?

Currently IDE extensions cannot extract the types of locally registered components, which makes it difficult to support strong typings of components inside SFC templates, see vuejs/language-tools#80.

What does the proposed API look like?

Expose the component types as generics (if possible):

export declare interface ComponentOptionsBase<LocalComponents extends Record<string, Component>, Props, ...> {
    components?: LocalComponents;
    ...
}

[HcySunYang]

Hi @johnsoncodehk , @gertqin . Can you two share more context or information? Let me know what we should do. Thanks~

[gertqin]

I think what is needed is something like this

import OtherComponent from "./OtherComponent.vue";

const myComponent = defineComponent({
  components: {
    OtherComponent
  },
  setup() {
  // ...
  }
})

type ExtractLocalComponents<T> = T extends DefineComponent<
  any,
  any,
  ...
  infer LC
>
  ? LC
  : never;

type LocalComponents = ExtractLocalComponents<typeof myComponent>;
// LocalComponents = { "OtherComponent": typeof OtherComponent }

That is, be able to extract the types of the locally registered components from the exported component similarly to props and emits (#2094). @johnsoncodehk is this correct?

[johnsoncodehk]

@gertqin I need to avoid use vue 3 helper types to support others like Vue.extends / @vue/composition-api / vue-class-component etc, so I would like to do this:

type LocalComponents = typeof myComponent extends { components?: infer C } ? C : unknown;
// LocalComponents = { "OtherComponent": typeof OtherComponent }