Typescript v-model defined types missing

matvejs16 commented 3 days ago

Vue - Official extension or vue-tsc version

2.0.22

VSCode version

1.91.0-insider

Vue version

3.4.30

TypeScript version

5.5.2

System Info

System:
    OS: Windows 11 10.0.22631
    CPU: (16) x64 11th Gen Intel(R) Core(TM) i7-11700K @ 3.60GHz
    Memory: 23.30 GB / 31.87 GB
Binaries:
    Node: 20.10.0 - C:\Program Files\nodejs\node.EXE
    npm: 10.8.1 - C:\Program Files\nodejs\npm.CMD
    pnpm: 8.9.2 - ~\AppData\Local\pnpm\pnpm.EXE
Browsers:
    Edge: Chromium (126.0.2592.68)
    Internet Explorer: 11.0.22621.3527

Steps to reproduce

Create vue component file with code:

const opened = defineModel('opened', {
type: Boolean,
default: true
});

Import and use in template tag created component in other vue file
```
<BottomSlider v-model:opened="opened"></BottomSlider>
```
No typescript hints for v-model:opened

Link to minimal reproduction

https://play.vuejs.org/#eNp9UstOwzAQ/BXLl1KpNEJwCmklinoAiYdoj75EySa4OLaxN6Goyr+zTpQSBPSWzIx3Z2f3wG+snTc18JgnCJVVKcJSaMaSlUE01UbJHBxrziuTg4qNBQ35QnAEj4Ivk2gso4dJNKpCvz5z0iLzgLUlRFbWOGQH5qBgLSucqdiE2k+O1I+2PT+Pbk3VuSSZ0JnRHlkwwBahztnFNPTtO1EPPuPoSVTIcr7zRtNohzCR4BmVkQrck0VJRQSPWccELlXKfNx3GLoaZgOevUL29ge+8/uACf7swINrQPAjh6krgeIJ9HrzCHv6PpIUZK1IfYJ8AW9UHTz2slWtc7I90nVu77rEpC63fr1H0H4YKhgNyrbTC07JhQT/G/3b7uX8qnsndEspDqn/vo1cNsttWEBI1GjQmEQBO71/plJdhtuh9sT2e+wvijaZQyE1PIQzO5v06GTWm8RPCzFdhlGQ6m4mB++1dJAPs7bT69EN8PYL6ZT3sg==

Any additional comments?

This behaviour happens even if you don't import created component and use it as global component with this file:

import bottomSlider from "@/components/bottomSlider.vue"

declare module 'vue' {
    export interface GlobalComponents {
        BottomSlider: typeof bottomSlider;
    }
}

As you can see in minimal reproduction link, there is Vue error that types are different, but typescript says nothing

RayGuo-ergou commented 3 days ago

~~It seems correct from your reproduction link, am i missing anything?~~

Nevermind, wasn't reading carefully.

so1ve commented 3 days ago

This playground hasn't upgraded to volar 2 yet

RayGuo-ergou commented 3 days ago

This playground hasn't upgraded to volar 2 yet

Can confirm that:

with: language server 2.0.21

matvejs16 commented 3 days ago

This playground hasn't upgraded to volar 2 yet

I used it only because there is same bahaviour like in VSCode with Vue - Official installed

matvejs16 commented 3 days ago

This playground hasn't upgraded to volar 2 yet

Can confirm that:

with: language server 2.0.21

Can't get same typescript hint in VSCode with latest (v2.0.22) Vue - Official installed

RayGuo-ergou commented 3 days ago

As the language server works okay, I reckon it's something in your VScode configuration. There's few things you can check

Is the hybrid mode enabled?
Did you pass the correct path of typesciprt, ( or if using workspace version, is that ^5 ?)

matvejs16 commented 3 days ago

As the language server works okay, I reckon it's something in your VScode configuration. There's few things you can check

Is the hybrid mode enabled?

Did you pass the correct path of typesciprt, ( or if using workspace version, is that ^5 ?)

Hybrid mode is on auto
(Not sure what do you mean)

I can also mention that other typescript related hints/errors work as expected. But maybe there is problem with typescript, I have installed JavaScript and TypeScript Nightly plugin in VSCode v5.6.20240627

RayGuo-ergou commented 3 days ago

Okay I guess 5.6 might be the issue as even minor update of typescript change lot of things.

But can you try to use this syntex to see if it works?

defineModel<boolean>('opend')

see: https://vuejs.org/api/sfc-script-setup.html#usage-with-typescript

matvejs16 commented 3 days ago

Okay I guess 5.6 might be the issue as even minor update of typescript change lot of things.

But can you try to use this syntex to see if it works?
defineModel<boolean>('opend')
see: https://vuejs.org/api/sfc-script-setup.html#usage-with-typescript

Yea, that worked ✅ So I will use this syntax to prevent this issue to happen again, but is it still considered as an issue?

RayGuo-ergou commented 3 days ago

but is it still considered as an issue?

Maybe can keep this open? 🤔

as defineProps does support infer type from parameter, e.g.

defineProps({
  msg: {
    type: String,
    required: true,
  },
})

Consider defineModel is fairly new, this could be one thing to improve.

matvejs16 commented 3 days ago

but is it still considered as an issue?

Maybe can keep this open? 🤔

as defineProps does support infer type from parameter, e.g.
defineProps({
  msg: {
    type: String,
    required: true,
  },
})
Consider defineModel is fairly new, this could be one thing to improve.

Agree, let's keep this open. Btw thanks for fast responses 🫡