vuejs/vue-eslint-parser

Using eslint to check TSX in Vue SFC file will throw wrong with "Parsing error: '>' expected"

zjc2782171149 opened this issue · 1 comments

Before You File a Bug Report Please Confirm You Have Done The Following...

  • I'm using eslint-plugin-vue.
  • I'm sure the problem is a parser problem. (If you are not sure, search for the issue in eslint-plugin-vue repo and open the issue in eslint-plugin-vue repo if there is no solution.
  • I have tried restarting my IDE and the issue persists.
  • I have updated to the latest version of the packages.

What version of ESLint are you using?

8.57.0

What version of eslint-plugin-vue and vue-eslint-parser are you using?

  • vue-eslint-parser@9.4.3
  • eslint-plugin-vue@9.27.0

What did you do?

<script lang="tsx" setup> const TestJSX = () => { return (
123
234
345
); } </script>

What did you expect to happen?

No parsing error

For example, if I run "pnpm exec eslint 'src/views/user/tags/content.vue' --fix" in my VSCode terminal, there have not any errors and show the blue color.

Image

What actually happened?

8:9 error Parsing error: '>' expected

Image

Link to Minimal Reproducible Example

https://github.com/Cat1007/parseErrorDemo

Additional comments

.eslintrc.yaml

env:
  browser: true
  es2021: true
extends:
  - eslint:recommended
  - plugin:vue/vue3-essential
  - plugin:@typescript-eslint/recommended
overrides: []
parser: vue-eslint-parser
parserOptions:
  parser: '@typescript-eslint/parser'
  project:
    - './tsconfig.eslint.json'
  ecmaVersion: latest
  ecmaFeatures:
    jsx: true
  sourceType: module
  extraFileExtensions:
    - '.vue'
plugins:
  - vue
  - '@typescript-eslint'
rules:
  indent:
    - error
    - 2
    - SwitchCase: 1
  linebreak-style:
    - error
    - unix
  quotes:
    - error
    - single
  semi:
    - error
    - always
  max-len:
    - off
  'vue/html-indent':
    - error
    - 2
  'vue/multi-word-component-names':
    - off
  'vue/attributes-order':
    - warn
  '@typescript-eslint/ban-ts-comment': off
  '@typescript-eslint/no-misused-promises': off

tsconfig.eslint.json

{
  "compilerOptions": {
    "target": "ESNext",
    "useDefineForClassFields": true,
    "module": "ESNext",
    "moduleResolution": "Node",
    "strict": true,
    "jsx": "preserve",
    "jsxImportSource": "vue",
    "sourceMap": true,
    "resolveJsonModule": true,
    "isolatedModules": true,
    "esModuleInterop": true,
    "lib": ["ESNext", "DOM"],
    "skipLibCheck": true,
    "paths": {
      "@/*": ["./src/*"]
    }
  },
  "include": [
    "src/**/*.ts",
    "src/**/*.d.ts",
    "src/**/*.tsx",
    "src/**/*.vue",
    "server/**/*.ts",
    "tests/**/*.ts",
    "jest.config.ts",
    "vite.config.ts",
    "auto-imports.d.ts",
    "components.d.ts"
  ]
}