Description
Vue - Official extension or vue-tsc version
2.1.6
VSCode version
1.93.1
Vue version
3.5.8
TypeScript version
5.5.4
System Info
System: OS: Linux 6.8 Ubuntu 24.04.1 LTS 24.04.1 LTS (Noble Numbat) CPU: (6) arm64 unknown Memory: 16.18 GB / 22.27 GB Container: Yes Shell: 5.2.21 - /bin/bash Binaries: Node: 20.17.0 - ~/.nvm/versions/node/v20.17.0/bin/node npm: 10.8.2 - ~/.nvm/versions/node/v20.17.0/bin/npm Browsers: Brave Browser: 128.1.69.168
package.json dependencies
"dependencies": { "vue": "^3.4.29" }, "devDependencies": { "@vitejs/plugin-vue": "^5.0.5", "vite": "^5.3.1" }
Steps to reproduce
JS (not TS) defineProps
with a required prop:
<script setup> defineProps({ msg: { type: String, required: true } }) </script>
In another component, import this component and use it in the template.
What is expected?
The prop cannot be omitted.
What is actually happening?
The prop is falsely marked as optional.
This image is from the repro repo:
When you define the component globally via components.d.ts
, the typing becomes more obvious:
There's no error for the missing required_prop
on the left. When I add lang="ts"
to the script tag on the right, the error appears.
Link to minimal reproduction
https://github.com/phil294/vue-bug-repo
Any additional comments?
When you define props as
<script> export default { props:{ msg: { type: String, required: true } }, setup() { } } </script>
nothing works at all. This was already reported in #4074 and is allegedly because of #3690 (which to me it doesn't seem like it but idk) which is labelled as a "minor" bug. In my opinion this isn't minor as arguably the main point of Volar, IntelliSense in Vue templates, is pretty much unusable if you're not using TS :-S