Eslint Vue 3 解析错误：'>' expected.eslint

Question

将 Eslint 添加到我的项目后，我在模板部分的 .vue 文件中收到此错误

Parsing error: '>' expected.eslint

在这个代码块中

Parsing error: '>' expected.eslint

基本上，向任何 HTML 标签添加属性都会引发此错误，

我使用的是带有“vue-ts”Vite 模板的 Vue 3。
VSCode 是我的编辑器，我显然是 ESlint 插件 :)
这是我的 .eslintrc 配置

<template>
  <div class="flex justify-center h-40">
    <div class="bg-blue-500 w-40 h-full"></div>
  </div>
</template>

谢谢 ！

Answer 1

您尚未parser在 eslint 配置中设置该选项。从文档：

默认情况下，ESLint 使用Espree作为解析器。[…] 要指示将 npm 模块用作解析器，请使用文件中的parser选项指定它.eslintrc。

使用VUE-eslint解析器来皮棉<template>的.vue文件：

{
  "parser": "vue-eslint-parser"
}