RFC: shorthand props

[zhiyuanzmj]

Just like svelte has shorthand attributes

<img {src} />

And after vue3.4 also supported same-name shorthand.

<img :src />

Proposal

Shorthand props

So can we also support shorthand props like svelte:

<img {src} />

I know jsx can use {...{ src }} instead, but it's not beautiful for me.

I already created a plugin unplugin-jsx-short-bind to support it, because of TS, espree and babel don't support shorthand props, so I use ast-grep to parse ast.

[KWangechi]

@zhiyuanzmj This is really awesome🙌, I'm also building sth similar but for Babel though. Is it possible to extend your plugin to React as well?

[zhiyuanzmj]

Yes unplugin-jsx-short-bind is framework-agnostic.

[zhiyuanzmj]

You can use ts-macro instead of @vue/language-tools to get type support.