vscode需eslint+prettier组合实现保存即清理：eslint修复多余分号（no-extra-semi）和空行（no-multiple-empty-lines），prettier负责排版；须配置codeactionsonsave并确保eslint支持对应文件类型。

VSCode 本身不会自动删多余空行或分号，必须靠插件 + 正确配置才能触发“保存即清理”——否则你手动选中再格式化，等于白装。

为什么 prettier 默认不删多余空行？

Prettier 的设计哲学是「最小改动」，prettier 默认只处理它认为“影响可读性”的空白（比如对象换行、函数参数对齐），但 空白行数量 和 结尾分号 属于风格偏好，需显式开启。

• prettier 默认保留函数/方法之间的空行，哪怕连续两个空行也不会合并
• semi: true（默认）只保证该有分号的地方有，但不会主动删掉多写的分号（比如 console.log();; 中的第二个分号）
• 真正能删重复分号的是 ESLint 的 no-extra-semi 规则，不是 Prettier

用 ESLint + Prettier 组合实现“保存即清理”

单靠一个工具做不到全自动清理，必须让 ESLint 检查并修复语法级冗余（如多余分号），Prettier 负责空白排版（含空行压缩）。

VSCode

避免常见的 VSCode 错误——设置冲突、调试器配置和扩展冲突。

下载

• 安装插件：ESLint（官方）、Prettier（官方）、ESLint Prettier（确保二者不冲突）
• 项目根目录加 .eslintrc.cjs，启用关键规则：

  module.exports = {
    rules: {
      'no-extra-semi': 'error',
      'no-multiple-empty-lines': ['error', { max: 1, maxEOF: 0, maxBOF: 0 }]
    }
  };

• VSCode 设置中打开："editor.codeActionsOnSave": { "source.fixAll.eslint": true } —— 这才是触发自动修复的关键开关
• ⚠️ 注意：如果同时开了 editor.formatOnSave，且格式化工具设为 Prettier，要确保 Prettier 不覆盖 ESLint 的修复结果；推荐关掉 formatOnSave，只留 codeActionsOnSave

如何安全压缩空行而不破坏逻辑分组？

直接把 max: 1 设成 0 会把所有空行干掉，导致模块/函数/注释块之间失去视觉呼吸感。实际中建议分级控制：

• max: 2 允许最多两个空行（适合用空行分隔大段逻辑）
• 配合注释保留空行：在需要强调分组处加 // --- user section ---，ESLint 不会动它上下空行
• 如果某文件想例外处理（比如生成的代码），在文件顶部加 /* eslint-disable no-multiple-empty-lines */
• Prettier 的 blankLine 规则（在 prettier.config.js）只能控制「哪里应该有空行」，不能删已有空行 —— 删空行仍是 ESLint 的事

最常被忽略的一点：ESLint 的自动修复（source.fixAll.eslint）只对「已开启检查的文件类型」生效。如果你编辑的是 .ts 文件但 .eslintrc 里没配 overrides 支持 TypeScript，那空行和分号照样纹丝不动。