Type '{ class: string; }' is not assignable to type 'DetailedHTMLProps, HTMLDivElement'

Question

I am using vue, ts, vite with volar extension.

In Vs code, I get the error Type '{ class: string; }' is not assignable to type 'DetailedHTMLProps, HTMLDivElement>'. Property 'class' does not exist on type 'DetailedHTMLProps, HTMLDivElement>'. Did you mean 'className'?ts(2322)

when I do

for the class

When I hover over the div I see (property) div: React.DetailedHTMLProps, HTMLDivElement>

I don't know what's making vs code assume I am using react. The file type is .vue

I disabled eslint and still get the error. It works when I run the app but it's annoying to see that error in vscode.

Am I supposed to add some d.ts file?

user_5599387 · Answer

Adding this fixed it. See here: https://github.com/johnsoncodehk/volar/discussions/592

// tsconfig.json
{
  "compilerOptions": {
    // ...
    "types": [
      "vite/client", // if using vite
      // ...
    ]
  }
}

I think when I added storybook it added react types

Type '{ class: string; }' is not assignable to type 'DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>'

1 Answers