如何排查VSCode是否使用ESLint/Prettier配置及格式化不一致问题

一、配置VSCode使其格式化与ESLint命令行行为一致 #

• 确保ESLint扩展正常运行
  打开VSCode扩展面板（Ctrl+Shift+X），找到ESLint扩展确认已安装并启用。若右下角无ESLint标识，尝试重启VSCode或重新安装扩展；也可通过命令面板（Ctrl+Shift+P）执行ESLint: Restart ESLint Server重启服务。
• 设置ESLint为默认格式化工具
  打开VSCode设置（Ctrl+,）：
  1. 搜索「Default Formatter」，将值设置为dbaeumer.vscode-eslint（ESLint扩展的官方ID）。
  2. 勾选「ESLint: Auto Fix On Save」和「Editor: Format On Save」，确保保存时自动用ESLint修复格式。
• 消除Prettier冲突
  1. 若安装了Prettier扩展，要么直接禁用，要么在工作区设置中添加"prettier.disableLanguages": ["typescript"]，阻止Prettier处理TS文件。
  2. 检查项目根目录是否存在隐藏的Prettier配置（如.prettierrc、package.json中的prettier字段），这些配置会覆盖ESLint的prettier规则，需删除或调整。
• 同步工作区ESLint配置
  在VSCode设置的「工作区」标签下，确认eslint.rules.quotes等规则与项目.eslintrc（或相关配置文件）完全一致，避免工作区配置覆盖项目规则。

二、排查VSCode格式化/代码检查的具体程序、扩展或配置 #

• 确认当前使用的格式化工具
  打开TS文件后右键选择「格式化文档」，若有多个选项会弹出选择框，直接查看当前可用的格式化器；也可点击VSCode底部状态栏右侧的格式化标识（若显示），查看当前生效的工具。
• 查看ESLint运行日志
  通过命令面板执行ESLint: Show Output Channel，查看ESLint的加载日志，里面会显示是否成功读取项目配置、是否存在依赖缺失或配置错误，以及执行检查/修复的详细过程。
• 检查VSCode设置优先级
  打开VSCode设置，切换到「工作区」标签，查看editor.defaultFormatter、eslint.*、prettier.*等配置的实际生效值；同时检查项目根目录的.vscode/settings.json文件，确认工作区专属配置是否正确。
• 排查扩展干扰
  暂时禁用所有非核心扩展（如Prettier、其他代码检查工具），重启VSCode后测试格式化行为，再逐步启用扩展，定位导致冲突的具体扩展。
• 验证ESLint版本一致性
  在命令行执行eslint --version，对比VSCode的ESLint输出日志中的版本号，确保两者版本一致——版本差异可能导致规则执行逻辑不同。

内容的提问来源于stack exchange，提问作者Daniel Kaplan