Missing component type definition

[tbontb-iaq]

Problem

VSCode cannot obtain component type information.

Steps to reproduce

1. Create a new project using pnpm create vuetify command
2. Choose "Recommended" preset, use Typescript and use pnpm
3. Install dependencies and use VSCode to open project

Run the pnpm run dev command and open the page in a browser to ensure that vite generates the corresponding type files.

Hover the mouse over the vuetify component and you can see that vscode cannot correctly identify their types.

Some information that may be useful

VSCode version: 1.91.1

Vue.volar: v2.0.26

[tbontb-iaq]

I found the complete type definitions in node_modules/vuetify/lib/index.d.mts, but I didn't know how to use them. I copied them into vite-env.d.ts and it worked fine.

[TianYa-Q]

You could do this

// vuetifyType.d.ts
declare module "vuetify/lib/framework" {
  import Vuetify from "vuetify";
  export default Vuetify;
}

[tbontb-iaq]

Thanks for your help. In fact they have fixed this in v3.6.13.

• typescript: augment GlobalComponents in multiple vue modules (fix: augment GlobalComponents in multiple vue modules vuetify#20144) (bd1f63d)

[KaelWD]

@tbontb-iaq please try the latest nightly build, we've changed this again: vuetifyjs/vuetify@7c8aeef
https://vuetifyjs.com/en/getting-started/installation/#nightly-builds

[tbontb-iaq]

No problems encountered. Test steps:

1. Create project with pn create vuetify
2. Install nightly with pn i vuetify@npm:@vuetify/nightly@latest and installed @vuetify/nightly 3.7.0-master.2024-08-17
3. Open the project with vscode, view HelloWorld component, and hover the mouse over the vuetify component to view the type definition