vuejs / eslint-config-typescript

ESLint configuration for Vue 3 + TypeScript projects
MIT License
128 stars 30 forks source link

Default `parserOptions.ecmaFeatures.jsx: true` breaks type assertion parsing in setup scripts #55

Open dmolesUC opened 1 year ago

dmolesUC commented 1 year ago

Steps to reproduce:

  1. Clone dmolesUC/ts-test for a complete reproducible example, or:

    1. create a Vue3/TypeScript project by running yarn create vite and selecting Vue and TypeScript
    2. add and configure ESLint, including this plugin
    3. 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>
  2. Run yarn eslint --ext .js,.ts,.vue src

Expected

Actual

Workaround

Note

I originally filed this as https://github.com/vuejs/vue-eslint-parser/issues/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.