Sublime Text中eslint-plugin-vue不报错,是因为.vue文件未被ESLint正确处理:需确保.eslintrc.js含overrides配置processor: 'vue/.vue'、parser: 'vue-eslint-parser',并安装vue-eslint-parser和eslint-plugin-vue,SublimeLinter-eslint须指向本地eslint路径且重启生效。

Sublime Text里eslint-plugin-vue不报错?先确认ESLint是否真在跑.vue文件
很多用户以为装了插件就自动生效,结果改了v-model拼写错误也没提示——根本原因是Sublime Text默认不把.vue文件交给ESLint处理。
关键点在于:ESLint本身不原生支持.vue,必须靠eslint-plugin-vue + 正确的overrides配置才能识别单文件组件里的<script>和<template>块。
- 检查项目根目录是否有
.eslintrc.js(或.eslintrc.cjs),且包含类似这样的overrides:
module.exports = {
extends: ['eslint:recommended', 'plugin:vue/vue3-essential'],
plugins: ['vue'],
overrides: [
{
files: ['*.vue'],
processor: 'vue/.vue'
}
]
}
- 确保
eslint-plugin-vue已安装:npm install eslint-plugin-vue --save-dev(版本需匹配Vue 2/3) - Sublime Text端必须用
SublimeLinter-eslint插件,且其设置中eslint_env_vars要指向项目本地node_modules/.bin/eslint,不能只依赖全局ESLint
SublimeLinter-eslint报Definition for rule 'vue/multi-word-component-names' was not found
这是典型规则注册失败:ESLint加载了插件,但没正确启用它提供的规则集。
-
vue/multi-word-component-names是eslint-plugin-vue的规则,不是ESLint内置规则,必须显式启用 - 在
.eslintrc.js的rules或extends中加入对应配置,例如:
extends: [ 'plugin:vue/vue3-essential' // ✅ 启用基础规则集 // 或手动开启单条规则: // 'vue/multi-word-component-names': 'error' ]
- 如果用了
eslint-config-airbnb-base这类第三方配置,它会覆盖plugin:vue的规则,需调整extends顺序,把plugin:vue放在最后 - 重启Sublime Text(或至少重启SublimeLinter服务),因为插件缓存规则列表,改配置后不重启无效
Template里v-bind:key没警告?检查parserOptions和processor是否协同工作
eslint-plugin-vue对<template>的校验依赖两个环节:解析器(parser)识别Vue模板语法,处理器(processor)把.vue拆成JS+HTML片段再分别 lint。
立即学习“前端免费学习笔记(深入)”;
- 必须同时配置
parser和processor:
module.exports = {
parser: 'vue-eslint-parser',
parserOptions: {
parser: '@babel/eslint-parser', // 解析<script>用Babel
ecmaVersion: 2020,
sourceType: 'module'
},
overrides: [{
files: ['*.vue'],
processor: 'vue/.vue'
}]
}
- 漏掉
parser: 'vue-eslint-parser'会导致<template>部分完全跳过校验 -
vue-eslint-parser必须安装:npm install vue-eslint-parser --save-dev - 注意:Vue 3项目用
plugin:vue/vue3-essential,Vue 2项目用plugin:vue/essential,混用会导致v-model等规则失效
保存时自动修复失败,eslint --fix在Sublime里不生效
SublimeLinter-eslint默认只做校验,不执行--fix;即使开了fix_on_save,也受限于规则是否支持自动修复。
- 确认
.eslintrc.js中该规则标记为fixable: true(如vue/multiline-html-element-content-newline可修,vue/require-v-for-key不可修) - SublimeLinter-eslint设置里加:
"fix_on_save": true,且确保"executable": "./node_modules/.bin/eslint"路径正确 - 某些规则(如
vue/valid-v-for)语义复杂,ESLint无法安全自动修复,只能报错,别指望它帮你补:key - 更可靠的修复方式:终端执行
npx eslint --fix src/**/*.vue,再回Sublime看效果
真正容易被忽略的是processor和parser的耦合关系——少一个,.vue就只剩<script>能被扫到,<template>和<style>等于裸奔。配错版本、路径或顺序,表面看着插件都装了,实际90%的校验根本没触发。


















