Skip to content

TSX can't add custom props because of IntrinsicAttributes don't extends any interface.Β #12384

@zhiyuanzmj

Description

@zhiyuanzmj

Vue version

vue3.5.10

Link to minimal reproduction

https://stackblitz.com/github/zhiyuanzmj/vue-jsx-reproduction?file=src%2FApp.tsx

Steps to reproduce

I want to custom props for every components. But In vue/jsx-runtime IntrinsicAttributes only extends ReservedProps.
The ReservedProps is a type, not a interface. So i can't use declare module to extend custom props.

// jsx.d.ts
declare module 'vue' {
  interface HTMLAttributes {
    vPermission?: string
    vLoading?: boolean
  }
  // How can i customize the props of every components?
  interface ReservedProps {
    vPermission?: string
    vLoading?: boolean
  }
}

export {}

Just like react:

// jsx.d.ts
declare module 'react' {
  interface HTMLAttributes {
    vPermission?: string
  }
  interface Attributes {
    vPermission?: string
  }
}

export {}

What is expected?

Make ReservedProps as interface.

What is actually happening?

I can't find any way to custom props.

System Info

System:
    OS: macOS 15.2
    CPU: (10) arm64 Apple M1 Pro
    Memory: 94.11 MB / 16.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 20.17.0 - /usr/local/bin/node
    Yarn: 1.22.22 - /usr/local/bin/yarn
    npm: 10.8.2 - /usr/local/bin/npm
    pnpm: 9.12.3 - ~/Library/pnpm/pnpm
    bun: 1.0.13 - ~/.bun/bin/bun
  Browsers:
    Chrome: 130.0.6723.117
    Safari: 18.2

Any additional comments?

No response

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions