Vue 常用的 ESLint 规则集

对Vue项目来说，Vue 官方通过 eslint-plugin-vue 提供了多个规则集（Rule Sets），适用于不同严格度和 Vue 版本。以下是主要的规则集及其对应的 ESLint 插件和用途：

---

1. Vue 2.x 规则集

适用于 Vue 2 项目，规则集名称以 plugin:vue/ 开头：

规则集名称	严格度	说明
plugin:vue/base	最低	仅包含 Vue 2 必要的语法解析规则（不检查代码质量）。
plugin:vue/essential	基础	避免 Vue 2 错误的必要规则（如 v-for 需要 key）。
plugin:vue/recommended	推荐	在 essential 基础上增加代码风格和最佳实践（更严格）。
plugin:vue/strongly-recommended	强推荐	在 recommended 基础上进一步强化代码一致性（如属性换行、组件命名）。

---

2. Vue 3.x 规则集

适用于 Vue 3 项目，规则集名称以 plugin:vue/vue3- 开头：

规则集名称	严格度	说明
plugin:vue/vue3-base	最低	Vue 3 必要的语法解析规则（不检查代码质量）。
plugin:vue/vue3-essential	基础	避免 Vue 3 错误的必要规则（如 Composition API 的 setup 检查）。
plugin:vue/vue3-recommended	推荐	扩展 essential，增加 Vue 3 风格和最佳实践。
plugin:vue/vue3-strongly-recommended	强推荐	更严格的代码格式要求（如模板缩进、属性顺序）。

---

3. 其他规则集

规则集名称	说明
plugin:vue/all	启用所有 Vue 2 规则（包括实验性规则，可能过于严格）。
plugin:vue/vue3-all	启用所有 Vue 3 规则（适合追求极致一致性的团队）。

---

对应的 ESLint 插件

所有 Vue 规则集均通过 eslint-plugin-vue 插件提供：

• 安装命令：

  npm install eslint-plugin-vue --save-dev
  

• 依赖的解析器：
  Vue 单文件组件（.vue）需要配合 vue-eslint-parser（内置在插件中），同时需指定 JavaScript 解析器（如 @babel/eslint-parser）：

  "parserOptions": {"parser": "@babel/eslint-parser"
  }
  

---

注意事项

• 避免混合使用 Vue 2 和 Vue 3 的规则集。
• 通常来说，根据 Vue 版本最常用的规则集是：
  Vue 2 → plugin:vue/recommended
  Vue 3 → plugin:vue/vue3-recommended
• 可通过 rules 字段覆盖或扩展默认规则：

  "rules": {"vue/multi-word-component-names": "off" // 关闭组件名必须多单词的规则
  }