Skip to content

Generic component not assignable to Component<Props<T>> #5980

@orlahowell

Description

@orlahowell

Vue - Official extension or vue-tsc version

3.2.5

VSCode version

n/a

Vue version

3.5.27

TypeScript version

5.9.3

System Info

n/a

package.json dependencies

{
  "dependencies": {
    "vue": "^3.5.27"
  },
  "devDependencies": {
    "@vitejs/plugin-vue": "^6.0.0",
    "typescript": "^5.9.3",
    "vite": "^7.0.6",
    "vue-tsc": "3.1.5"
  }
}

Steps to reproduce

Reproduction link

  1. Run npm run tsc
  2. See error:
src/types.ts:13:14 - error TS2322: Type '<T>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<...>) => import("vue").VNode & { __ctx?: Awaited<t...' is not assignable to type 'Component<ComponentProps<string>> | undefined'.
  Type '<T>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<...>) => import("vue").VNode & { __ctx?: Awaited<t...' is not assignable to type 'FunctionalComponent<ComponentProps<string>, {}, any, {}>'.
    Types of parameters '__VLS_props' and 'props' are incompatible.
      Type 'ComponentProps<string> & {}' is not assignable to type 'VNodeProps & AllowedComponentProps & ComponentCustomProps & { value: string; } & Record<string, unknown>'.
        Type 'ComponentProps<string> & {}' is not assignable to type 'Record<string, unknown>'.
          Index signature for type 'string' is missing in type 'ComponentProps<string> & {}'.

13   component: GenericComponent, // ERROR in vue-tsc 3.2.5. NO ERROR in 3.1.4

What is expected?

GenericComponent is a component that has props ComponentProps<T>.

I would expect GenericComponent to be assignable to Component<ComponentProps<T>>.

What is actually happening?

GenericComponent is NOT assignable to Component<ComponentProps<T>> and throws the following error:

src/types.ts:13:14 - error TS2322: Type '<T>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<...>) => import("vue").VNode & { __ctx?: Awaited<t...' is not assignable to type 'Component<ComponentProps<string>> | undefined'.
  Type '<T>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<...>) => import("vue").VNode & { __ctx?: Awaited<t...' is not assignable to type 'FunctionalComponent<ComponentProps<string>, {}, any, {}>'.
    Types of parameters '__VLS_props' and 'props' are incompatible.
      Type 'ComponentProps<string> & {}' is not assignable to type 'VNodeProps & AllowedComponentProps & ComponentCustomProps & { value: string; } & Record<string, unknown>'.
        Type 'ComponentProps<string> & {}' is not assignable to type 'Record<string, unknown>'.
          Index signature for type 'string' is missing in type 'ComponentProps<string> & {}'.

13   component: GenericComponent, // ERROR in vue-tsc 3.2.5. NO ERROR in 3.1.4

Link to minimal reproduction

https://stackblitz.com/edit/vitejs-vite-ocdxptuw?file=src%2Ftypes.ts

Any additional comments?

I can see this bug appeared when upgrading from 3.1.4 -> 3.1.5. It looks like it could have something to do with this PR #5748 but I don't know enough what I'm looking at to pinpoint what is happening.

Metadata

Metadata

Assignees

No one assigned

    Labels

    good reproduction ✨This issue provides a good reproduction, we will be able to investigate it first🔩 p2-edge-case

    Type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions