Version

3.2.33

Reproduction link

https://stackblitz.com/edit/vue-issue-repro-5764?file=src/App.vue&terminal=dev

Steps to reproduce

1. Create a component with <script lang="tsx">.
2. Use a TypeScript type assertion as or : inside a prop binding in <template>.

What is expected?

TypeScript type assertions are compiled away as with <script lang="ts">.

What is actually happening?

Inside a Vue 3 SFC when using <script lang="tsx"> TS type assertions are not stripped away in the <template>, which leads to an 'Unexpected identifier' SyntaxError in the browser, because type assertion syntax is not valid JS.

I am using <script lang="tsx"> because of a nice use case, where I am defining inline JSX Functional Components, which I can then use in the same .vue SFC and also export them for use in slots of the component.

Only lang="ts" is supported for