Subscribe on changes!

Provide typed custom event support in TSX

avatar
Jun 20th 2021

What problem does this feature solve?

The problem has already been described in https://github.com/vuejs/vue-next/issues/1553. However, the issue was closed without an actual fix/improvement. As the typing problem persists, I've decided to open a new issue:

The problem

The Vue 3 TSX story is incomplete. More specifically, custom events will lead to type errors in TSX, because the typing does not work as desired (leading to error "property onCustomEvent does not exist on type IntrinsicAttributes...").

As custom events are a core feature of Vue, this gap in typing basically means that a setup with Vue + Typescript + TSX is not viable. The missing typing support for events currently blocks real world usage.

In issue #1553 it was mentioned by @yyx990803 that template literal types are a necessary Typescript feature to enable event typing in TSX. Since that feature is now shipped, this TSX event typing improvement can be implemented.

What does the proposed API look like?

There are no proposed changes in the (public) API beyond what is already possible with the "emits" property. The only change is that event typing should work in TSX code.