在 WebStorm 2023 中配置 ESLint 保存自动修复，需在设置中勾选"Run ESLint `--fix` on save"选项。该功能依赖项目本地安装的 ESLint 包，若未初始化 ESLint 配置则无法触发修复。
先说结论：WebStorm 2023 内置 ESLint 支持，开启保存修复只需勾选特定配置项，无需安装额外插件。
- 适合：已安装 eslint 包且希望保存时自动修正代码格式的项目。
- 先准备：确保项目根目录存在 .eslintrc 配置文件且 IDE 能识别 ESLint 包路径。
- 验收：保存文件后观察代码是否自动调整，且底部状态栏无 ESLint 报错。
快速处理思路
通过 IDE 设置界面启用自动修复功能，路径为 Settings -> Languages & Frameworks -> JavaScript -> Code Quality Tools -> ESLint。
为什么会这样
WebStorm 集成了 ESLint 命令行工具的能力，允许在文件保存事件触发时调用 eslint `--fix`。
IDE 本身不执行修复逻辑，而是调用项目本地或全局安装的 ESLint 库，因此配置依赖外部依赖包的存在。
分步处理
1. 打开设置：Windows/Linux 按 Ctrl+Alt+S，macOS 按 Cmd+,，进入 Settings。
2. 定位菜单：依次展开 Languages & Frameworks > JavaScript > Code Quality Tools > ESLint。
3. 启用选项：勾选"Run ESLint `--fix` on save"复选框。
4. 确认路径：检查"ESLint package"是否指向正确的 node_modules/eslint 路径，通常 IDE 会自动检测。
怎么验证是否生效
打开一个存在 ESLint 可修复错误（如缩进、引号）的 JavaScript 或 TypeScript 文件，执行保存操作。
若配置生效，代码格式会自动调整，且 Event Log 窗口不会显示 ESLint 修复失败的警告。
常见坑
1. Prettier 冲突：若同时启用 Prettier 格式化，可能与 ESLint 修复规则冲突，建议禁用其中一方的保存触发。
2. 包未安装：项目未运行 npm install 导致 IDE 找不到 ESLint 包，选项虽可勾选但实际不执行。
3. 规则不可修复：部分 ESLint 错误属于逻辑错误，无法通过 `--fix` 自动修复，保存后仍会保留红色警告。
常见问题
开启后保存没有反应怎么办
检查项目是否安装了 eslint 依赖，并在 ESLint 设置页确认状态显示为"ESLint is ready"。
ESLint 和 Prettier 哪个应该优先
若项目同时使用两者，建议在 Prettier 配置中关闭与 ESLint 冲突的规则，或仅保留一方的保存自动执行。
为什么部分错误保存后依然存在
并非所有 ESLint 规则都支持自动修复，逻辑类错误需手动修改代码。
参考来源
JetBrains Official Documentation, "ESLint | WebStorm Documentation", https://www.jetbrains.com/help/webstorm/eslint.html