VSCode保存时自动修复Vue代码的关键是ESLint必须正确识别并处理.vue文件：需在settings.json中配置"eslint.validate": ["javascript", "typescript", "vue"]，安装兼容版本的eslint-plugin-vue（Vue 3用v9+），禁用Vetur改用Volar，设"source.fixAll.eslint": true而非"source.fixAll"，并关闭"editor.formatOnSave"以防Prettier覆盖。
VSCode 保存时自动修复 Vue 代码，关键不在装插件，而在 ESLint 能否真正接管 .vue 文件的 script 和 template 区域——否则你看到的“报错”和“修复”都是假动作。
为什么 editor.codeActionsOnSave 设了却没反应？
最常见原因是 ESLint 没识别到 .vue 文件：默认只校验 javascript 和 typescript，不包含 vue。必须显式加入 "eslint.validate" 列表：
-
"eslint.validate": ["javascript", "typescript", "vue"]—— 缺少"vue"就不会检查单文件组件 - 若项目用的是
<script setup></script>，还需确保eslint-plugin-vue版本 ≥ 9.0（Vue 3.3+ 推荐用eslint-plugin-vue@latest） - 旧项目若混用 Vetur，它会抢走
.vue的语言服务，导致 ESLint 校验失效；必须禁用 Vetur，改用 Volar + TypeScript Vue Plugin
source.fixAll.eslint 和 source.fixAll 有什么区别？
前者只触发 ESLint 自身支持的修复（比如 no-unused-vars、vue/multi-word-component-names），后者是泛用型指令，可能调用其他格式化器，反而绕过 ESLint 规则。
- 务必用
"source.fixAll.eslint": true，而不是"source.fixAll": true - 如果同时启用了 Prettier，
editor.formatOnSave必须设为false，否则 ESLint 修复后 Prettier 立刻覆盖，形成“修了又乱”的循环 - 想让 Prettier 也参与，应通过
eslint-config-prettier关闭 ESLint 中与格式相关的规则，再由 ESLint 统一修复
Vue 项目里 .eslintrc.* 配置该用 JS 还是 CJS？
取决于 Node.js 版本和 ESLint CLI 启动方式。2026 年主流项目已默认启用 ESM，但 VSCode 的 ESLint 插件仍更稳定兼容 .cjs 后缀。
立即学习“前端免费学习笔记（深入）”；
- 推荐用
.eslintrc.cjs，导出为module.exports = { ... } - 若用
.eslintrc.js且含import语法，需确认项目package.json有"type": "module"，否则 VSCode 插件加载失败，状态栏 ESLint 图标变灰 - Vue 官方脚手架生成的配置多为
.eslintrc.js，但实际运行时依赖eslint-plugin-vue的flat配置入口；如遇规则不生效，优先检查插件版本是否匹配 Vue 版本
真正卡住人的往往不是配置项本身，而是 ESLint 插件在后台加载时静默失败——比如 node_modules 里缺失 eslint-plugin-vue，或 eslint.options.extensions 漏写了 ".vue"。打开 VSCode 输出面板，切换到 ESLint 标签页，看有没有 Failed to load plugin 或 Cannot read property 'parse' of undefined 这类日志，比反复改 settings.json 有效得多。
