必须安装 eslint 插件（dirk baeumer 维护），配置 editor.codeactionsonsave 启用自动修复，确保 eslint.config.js 中 files 包含 .server.tsx 等后缀且规则支持 --fix。
VSCode保存时自动修复ESLint报错需要哪些插件和配置
必须装 ESLint 插件（由 Dirk Baeumer 维护），不是“Prettier”或“ESLint Formatter”这类已废弃或功能不全的替代品。Next.js 项目默认用 eslint-config-next，它依赖 ESLint v8.23+ 和 TypeScript 支持，所以 Node 版本低于 16.14 或 ESLint CLI 全局安装了旧版，eslint --fix 就会静默失败——这点最容易被忽略。
关键配置项只有两个："editor.codeActionsOnSave" 控制触发时机，"eslint.autoFixOnSave" 已被弃用，别写。
- 确保工作区根目录有
.eslintrc.json或eslint.config.js（Next.js 13.4+ 推荐后者） - 如果用
eslint.config.js，导出对象里必须包含files: ["**/*.js", "**/*.jsx", "**/*.ts", "**/*.tsx"]，否则 TSX 文件不参与检查 - VSCode 设置中禁用
Prettier的 auto-save fix，否则和 ESLint 冲突，保存时只生效一个
如何让 Next.js 的 server components（.server.tsx）也被 ESLint 修复
默认 ESLint 不识别 .server.tsx 或 .client.tsx 后缀，会跳过这些文件。不是插件问题，是 eslint.config.js 里 files 模式没覆盖到。
改法很简单：把 files 扩展成 ["**/*.js", "**/*.jsx", "**/*.ts", "**/*.tsx", "**/*.server.tsx", "**/*.client.tsx"]。注意顺序无关，但漏掉任意一个 glob 就不会触发修复。
- Next.js App Router 下，
use client组件常写成.client.tsx，不加进files列表，保存时完全没反应 - 如果项目用了
eslint-plugin-react-compiler，它目前不支持.server.tsx，强行加入会导致Definition for rule 'react-compiler' was not found - VSCode 状态栏右下角能看到当前文件是否被 ESLint 激活（显示 “ESLint” 字样），没显示就说明
files不匹配
为什么保存后只提示错误却不自动修复
最常见原因是 ESLint 规则本身不可自动修复。比如 no-unused-vars 可 fix，但 react-hooks/exhaustive-deps 在某些嵌套场景下无法安全插入依赖项，ESLint 就跳过修复——此时 VSCode 不报错也不提示，看起来像“没反应”。
验证方法：终端进项目根目录，执行 npx eslint --fix pages/index.tsx（换成你实际文件路径），看输出里有没有 ✖ 1 problem (1 error, 0 warnings) 后面跟 1 error and 0 warnings potentially fixable with the `--fix` option. 这句。没有就说明规则不支持 fix。
- 检查
eslint.config.js中规则配置是否带fix: true（新版 ESLint 不需要显式写，但自定义规则可能需要） -
import/no-unresolved默认不可修复，除非配了settings.import/resolver - Next.js 项目若启用了
experimental.esmExternals，ESLint 可能因解析失败而跳过整个文件，需在settings里加{"node": {"resolvePaths": ["./node_modules"]}}
保存即修复但格式错乱（比如 JSX 换行、缩进异常）
这是 ESLint 和 Prettier 协作失败的典型表现。Next.js 官方模板默认启用 Prettier，但 ESLint 的 prettier/@typescript-eslint 插件链如果版本不匹配，--fix 会覆盖 Prettier 格式规则。
解法不是禁用 Prettier，而是统一交给 ESLint 管理：在 eslint.config.js 的 plugins 里确保有 prettier，并在 rules 最后加上 "prettier/prettier": "error"。这样 ESLint 修复时会调用 Prettier 的格式逻辑，而非自己猜。
- 删掉
.prettierrc或prettier.config.js，所有格式规则收口到 ESLint 配置里，避免双引擎打架 - 如果用了
@typescript-eslint/eslint-pluginv6+，必须同步升级eslint-plugin-prettier到 v5+，否则prettier/prettier规则不生效 - VSCode 的
editor.formatOnSave必须设为false，否则 Prettier 和 ESLint 先后执行两次格式化，JSX 开闭标签容易被拆成四行
