v-bind shorthand (3.4) does not work with TS + "import * as" #10515
Labels
🔨 p3-minor-bug
Priority 3: this fixes a bug, but is an edge case that only affects very specific usage.
🐞 bug
Something isn't working
scope: compiler
Vue version
3.4.21
Link to minimal reproduction
https://play.vuejs.org/#eNqFUslOwzAQ/RXLQmpBxTnAqaRUgHoACaiAG+YQJdPg1rEt2ympovw7Y4eWqmK5zfLezJulpVfGsHUNdExTl1thPHHga0NkpsoJp95xesmVqIy2npyQzJHMCLKwuiIDlqDt2NINLnaQ+82NrkwP4JQlwQsNOEUMV7lWTktgUpdDJDO9OsZ4mvS9sRM6HiojMw/oEZJWm9M8VByHvgnG0mQPQEcoEYsuRIk6tMI52kDjNJCEBPtovMCmnI5JzIRcJqX+uIsxb2sYbeP5O+SrH+JL14QYp3MLDuwap9nlfGZL8H169vwADdq7ZKWLWiL6j+QT4ELqoLGHXdeqQNl7uKj2Nq5XqPLFzRoPym2HCkIDsot4TnHXYee/jf4t94ydRx5XHW5xe6fDR4hHKGAhFMytNm74ioKM4PTtv8MVYh0NQtqWHJlAZv3JyXSKSnDOWLbglHSoAilJzzm88NeXoTRo4pOFL/IEC02wjl7hb9HuEwp97X0=
Steps to reproduce
It looks like the following conditions must be met:
import * as something
:something
Also be careful with HMR: it seems like after the page worked once (e.g. because I used the long form), the shorthand then seems to work. But it really doesn't, as demonstrated after a server restart.
What is expected?
Works just like
:something=something
.What is actually happening?
:something
props is bound to undefined. See repro link.You can make it work by switching to long form.
System Info
Any additional comments?
It is clear in SFC repro that
api
is omitted from returned state by SFC compiler:const __returned__ = { MyComp }
If you switch the playground to prod mode, the result is actually correct and works:
return (_openBlock(), _createBlock(MyComp, { api: api }))
Somehow it also seems to work in JS, so I suspected this is TS removing imports that are not used at all or only in type positions. But as my repro shows, adding
console.log(something)
properly preserves the import in JS output, but the SFC binding is still compiled incorrectly, so something else is going on.The text was updated successfully, but these errors were encountered: