Vue TSX - How to tell Typescript that the HTML attributes are allowed in reusable components?

Suppose I have this input component:

import { defineComponent } from "@vue/runtime-core"    export default defineComponent({      inheritAttrs: false,      setup(props, { attrs }) {          return () => (              <div>                  <input type="text" {...attrs} />              </div>          )      }  })  

Now, I use this component like so and provide type="password" attribute:

import { defineComponent } from "@vue/runtime-core"  import Input from "./components/input"    export default defineComponent({      setup(props, { attrs }) {          return () => <Input type="password"></Input>      }  })  

But Typescript complains:

Property 'type' does not exist on type 'IntrinsicAttribute'> & VNodeProps & AllowedComponentProps & ComponentCustomProps>'  

https://stackoverflow.com/questions/66684622/vue-tsx-how-to-tell-typescript-that-the-html-attributes-are-allowed-in-reusabl March 18, 2021 at 12:07PM