Native DOM event type checking error since upgrading to 1.0.3

[ymy0622]

Native DOM event type checking error. (click, contextmenu, etc.)

vue@3.2.40
vite@3.1.7
vitejs/plugin-vue@3.1.2
vue-tsc@1.0.3
volar@1.0.3

I have deleted and installed yarn.lock + node_modules.

<template>
  <div @click="test"></div>
</template>

<script setup lang="ts">
  const test = () => {}
</script>

Type '() => void' is not assignable to type 'MouseEvent'.ts(2322)
__VLS_types.ts(107, 56): The expected type comes from property 'click' which is declared here on type 'EventObject<undefined, "click", {}, MouseEvent | undefined>'

[jbaubree]

Same issue here

[vsdeeper]

I got a similar error like this：

[bjornharrtell]

For me it works after pinning @types/node to 18.8.0 (+removing lockfile and reinstall deps).

[IagoLast]

Same thing but when using vue-tsc from the console

[ymy0622]

For me it works after pinning @types/node to 18.8.0 (+removing lockfile and reinstall deps).

Wow, it works.
Thank you very much.

[vsdeeper]

For me it works after pinning @types/node to 18.8.0 (+removing lockfile and reinstall deps).

Wow, it works. Thank you very much.

Also works for me.

[jbaubree]

@ymy0622 are you sure this is a real solution and not a workaround before fix ?

[bjornharrtell]

@ymy0622 I think you should leave this open. It's not really a desired workaround to pin @types/node.

[njtyair]

同样的报错信息
__VLS_types.ts(107, 56): 所需类型来自属性 "click"，在此处的 "EventObject<undefined, "click", {}, MouseEvent | undefined>" 类型上声明该属性

[lesonky]

1.0.3 继续报错，导致 vscode 里面报错，我的build 命令还用了
vue-tsc --noEmit && vite build --config ./config/vite.config.prod.ts

导致无法打包，只能把 vue-tsc 去掉

[IagoLast]

@bjornharrtell I'm trying to do the @types/node hotfix but still doesn't work...

Any idea of how volar / vue-tsc infer DOM typings? or how the __VLS_types.ts file is generated?

I'm stuck because of this 😭

[jbaubree]

@IagoLast make sure to put "@types/node": "18.8.0" and not "@types/node": "^18.8.0".
Edit: remove node_modules folder and lock file before install again.

[widetrace]

@IagoLast make sure to put "@types/node": "18.8.0" and not "@types/node": "^18.8.0". Edit: remove node_modules folder and lock file before install again.

thanks!

[fy5220]

I did that and still does not work 🤔

when u done this , reopen the vscode

@IagoLast make sure to put "@types/node": "18.8.0" and not "@types/node": "^18.8.0". Edit: remove node_modules folder and lock file before install again.

[Georgitto]

Still getting the same problem after changing the version of @types/node to 18.8.0 and reinstalling all dependencies (deleting node_modules folder and yarn.lock).

[steveaffleck]

18.8.0 didn't work for me but 18.7.14 did.

[cuebit]

Works with @types/node@18.8.3 also.

[johnsoncodehk]

Please track vuejs/core#6855

[johnsoncodehk]

We can't fix this problem in language server, but we will have a doctor message to remind user downgrade @types/node to 18.8.0 or update to next vue release.

[vis97c]

We can't fix this problem in language server, but we will have a doctor message to remind user downgrade @types/node to 18.8.0 or update to next vue release.

Does it mean that it cannot be solved from vue-tsc?

[acidjazz]

why is this issue closed but not yet fixed?

[MaoXuKun]

我遇到了同样的问题，解决方案是切换 VSCode 的 TS 使用工作区版本。
操作方法为 Ctrl + Shift + P，输入 selectTypeScriptVersion，然后选择 Use Workspace Version。

[warmthsea]

What should I do?

[Adam-Ponting]

For me it works after pinning @types/node to 18.8.0 (+removing lockfile and reinstall deps).

This worked for me, though I did have to add @types/node to my devDependencies in package.json.

[azat-io]

I have the same problem.

But I'm not using @types/node directly. Here is my tsconfig.json:

{
  "compilerOptions": {
    "forceConsistentCasingInFileNames": true,
    "types": ["@vuepress/client/types"],
    "importsNotUsedAsValues": "error",
    "moduleResolution": "nodenext",
    "preserveValueImports": true,
    "resolveJsonModule": true,
    "isolatedModules": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "module": "esnext",
    "target": "es2020",
    "jsx": "preserve",
    "allowJs": true,
    "strict": true,
    "baseUrl": ".",
    "noEmit": true,
    "paths": {
      "~/components/*": ["./components/*"],
      "~/typings/*": ["./typings/*"],
      "~/assets/*": ["./assets/*"],
      "~/pages/*": ["./pages/*"],
      "~/icons/*": ["./icons/*"]
    }
  },
  "include": ["**/*.ts", "**/*.vue"],
  "exclude": ["node_modules"]
}

[vis97c]

I have the same problem.

But I'm not using @types/node directly. Here is my tsconfig.json:

{
  "compilerOptions": {
    "forceConsistentCasingInFileNames": true,
    "types": ["@vuepress/client/types"],
    "importsNotUsedAsValues": "error",
    "moduleResolution": "nodenext",
    "preserveValueImports": true,
    "resolveJsonModule": true,
    "isolatedModules": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "module": "esnext",
    "target": "es2020",
    "jsx": "preserve",
    "allowJs": true,
    "strict": true,
    "baseUrl": ".",
    "noEmit": true,
    "paths": {
      "~/components/*": ["./components/*"],
      "~/typings/*": ["./typings/*"],
      "~/assets/*": ["./assets/*"],
      "~/pages/*": ["./pages/*"],
      "~/icons/*": ["./icons/*"]
    }
  },
  "include": ["**/*.ts", "**/*.vue"],
  "exclude": ["node_modules"]
}

It doesn't matter that you don't use it directly. Dependencies can install dependecies. Alternatively if you are using yarn use resolutions instead.

E: As stated by @yah-yuan updating vue should fix the issue.

[tzhang-dev]

seems vue@3.2.41 has been released and fixed this problem. I upgraded vue and @types/node to the latest, and the error no longer exists.

[cuebit]

seems vue@3.2.41 has been released and fixed this problem. I upgraded vue and @types/node to the latest, and the error no longer exists.

Sadly this doesn't seem to be the case for many. v3.2.40...v3.2.41 shows no indication of any fix for this and the actual fix (vuejs/core#6855) is yet to be merged and released.

[loneil]

seems vue@3.2.41 has been released and fixed this problem. I upgraded vue and @types/node to the latest, and the error no longer exists.

Are you sure about that? Vue 3.2.41 hasn't fixed this issue. Is it possible your types/node in your lock is still pinned to 18.8.0 and you didn't really update it? I'm trying starting from scratch and as of right now with the latest everything, you still need that 18.8.0 pin

[johnsoncodehk]

Please wait for 3.2.42 and pin @types/node to 18.8.0 for now. :)

[johnsoncodehk]

Please also track DefinitelyTyped/DefinitelyTyped#62729 (Fix for next @types/node version)

[johnsoncodehk]

@types/node fixed this problem in 18.11.1, 18.11.2 and later version by DefinitelyTyped/DefinitelyTyped#62782, please upgrade to fix.

But Volar 1.0.8 will still have doctor warns for 18.11.1, 18.11.2 because we can't hot update the version judge, please just ignore the warning or you can disable doctor (not recommend) by add "volar.doctor.statusBarItem": false VSCode setting.

[rodrigocfd]

@johnsoncodehk Shouldn't Volar have a new version disabling the doctor warning now?