Adding storybook shows Type '{ class: string; }' is not assignable to type error

I added storybook to my vue project. Once I add I get error in vs code when I set class on an element.

When I do <div class=""></div> I get

Type '{ class: string; }' is not assignable to type 
'DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>'.
  Property 'class' does not exist on type 'DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>'. 
Did you mean 'className'?ts(2322)

When I hover over a div, I see

(property) div: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>

in vs code.

This is a vue project with .vue file.

This happens only when I add storybook. To add storybook, the command I used is

npx sb@next init --builder storybook-builder-vite

I don’t know what’s making vs code assume the code is React

[IanVS]

@khusseini can you please open a new issue and fill out the template?

[abhic91]

@IanVS Adding this fixed it. See here: johnsoncodehk/volar#592

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