"Cannot find name 'T'", when using generics and defineModel with name in backticks #5122
Closed as not planned
Closed as not planned
Description
Vue - Official extension or vue-tsc version
2.2.0
VSCode version
1.96.2
Vue version
3.5.13
TypeScript version
5.6.3
System Info
System:
OS: Linux 6.12 Fedora Linux 41 (Workstation Edition)
CPU: (16) x64 AMD Ryzen 7 7840U w/ Radeon 780M Graphics
Memory: 54.59 GB / 60.62 GB
Container: Yes
Shell: 5.2.32 - /bin/bash
Binaries:
Node: 20.18.1 - ~/.nvm/versions/node/v20.18.1/bin/node
Yarn: 1.22.22 - /usr/local/bin/yarn
npm: 10.8.2 - ~/.nvm/versions/node/v20.18.1/bin/npm
bun: 1.1.42 - ~/.bun/bin/bun
Browsers:
Chrome: 131.0.6778.264
package.json dependencies
{
"dependencies": {
"vue": "^3.5.13"
},
"devDependencies": {
"@tsconfig/node22": "^22.0.0",
"@types/node": "^22.10.2",
"@vitejs/plugin-vue": "^5.2.1",
"@vue/tsconfig": "^0.7.0",
"npm-run-all2": "^7.0.2",
"typescript": "~5.6.3",
"vite": "^6.0.5",
"vite-plugin-vue-devtools": "^7.6.8",
"vue-tsc": "^2.1.10"
}
}
Steps to reproduce
npm create vue@latest
- Create a component with generic and a
defineModel
which references that generic and has a name (in backticks).<template> <div></div> </template> <script setup lang="ts" generic="T"> const model = defineModel<T>(`model`); </script>
- Run type check
npm run type-check
What is expected?
The type check should return successfully.
What is actually happening?
vue-tsc
returns type errors:
> [email protected] type-check
> vue-tsc --build
src/components/TestWithNamedModel.vue:5:34 - error TS2304: Cannot find name 'T'.
5 <script setup lang="ts" generic="T">
~
src/components/TestWithNamedModel.vue:6:27 - error TS2304: Cannot find name 'T'.
6 const model = defineModel<T>(`model`);
~
Found 2 errors.
Link to minimal reproduction
https://github.com/DerZade/vue-tsc-define-model-generics-bug
Any additional comments?
The example repo includes four components, of which three work and one has errors:
Script setup | Pass? |
---|---|
defineProps<{ foo: T }>(); |
✔️ |
const model = defineModel<T>(); |
✔️ |
const model = defineModel<T>('model'); |
✔️ |
const model = defineModel<T>(`model`); |
❌ |