Open
Description
Steps to reproduce:
-
Clone dmolesUC/ts-test for a complete reproducible example, or:
-
create a Vue3/TypeScript project by running
yarn create vite
and selectingVue
andTypeScript
-
add and configure ESLint, including this plugin
-
modify
components/HelloWorld.vue
to contain the code below:<script setup lang="ts"> import { Ref, ref } from 'vue' defineProps<{ msg: string }>() const count: Ref<number | undefined> = ref(0) function incrementCount() { const c = <number>count.value // <- type assertion is here count.value = c + 1 } </script>
-
-
Run
yarn eslint --ext .js,.ts,.vue src
Expected
- Code lints without errors; or, at least, ESLint is able to parse the Vue component source file.
Actual
-
Closing brace of the
incrementCount()
function produces the following parsing error:/Users/david/Work/Scratch/ts-test/src/components/HelloWorld.vue 12:0 error Parsing error: Unexpected token. Did you mean `{'}'}` or `}`? ✖ 1 problem (1 error, 0 warnings)
Workaround
- in
.eslintrc.cjs
, addecmaFeatures: { jsx: false }
toparserOptions
Note
I originally filed this as vuejs/vue-eslint-parser#177, but @ota-meshi identified the issue as being the jsx
config in eslint-config-typescript/index.js
.
It's not clear to me why JSX support needs to be enabled by default for Vue projects, which I think tend not to use it that often. But at least this issue documents the workaround.
Metadata
Metadata
Assignees
Labels
No labels