如何配置VSCode在保存时自动格式化？

vscode 保存时自动格式化需开启 formatOnSave 并配置默认格式化工具（如 Prettier、ESLint）；安装对应扩展，在 settings.json 中设置 “editor.formatOnSave”: true 和 “editor.defaultFormatter”，支持按语言单独指定 formatter，JS/TS 可配合 ESLint 的 “source.fixAll.eslint” 实现保存时自动修复。

VSCode 保存时自动格式化，关键在于开启 formatOnSave 并配置好默认格式化工具（如 Prettier、ESLint 或语言自带 formatter）。

启用保存时自动格式化

打开 VSCode 设置（Ctrl+, 或 Cmd+,），搜索 format on save，勾选 Editor: Format On Save。也可直接在 settings.json 中添加：

• "editor.formatOnSave": true

指定默认格式化工具

VSCode 不自带完整代码格式能力，需安装扩展（如 Prettier、ESLint、python Extension）并设为默认。例如用 Prettier 格式化 javaScript/typescript：

• 安装 Prettier 扩展
• 在 settings.json 中设置：
  "editor.defaultFormatter": "esbenp.prettier-vscode"
• 若项目有 .prettierrc，Prettier 会自动读取规则

按语言单独配置（可选但推荐）

不同语言可能需要不同 formatter，避免全局冲突。比如让 TypeScript 用 Prettier，而 markdown 用内置格式器：

• 在 settings.json 中添加：
  "[typescript]": { "editor.defaultFormatter": "esbenp.prettier-vscode" }
"[markdown]": { "editor.defaultFormatter": "vscode.markdown-language-features" }

配合 ESLint 自动修复（JS/TS 场景）

如果想在保存时同时运行 ESLint 修复（比如修复 semi、quotes），需额外配置：

• 安装 ESLint 扩展
• 启用 ESLint 保存时修复：
  "editor.codeActionsOnSave": { "source.fixAll.eslint": true }
• 确保项目中已安装 eslint 和对应插件，并有 .eslintrc.js 配置

基本上就这些。只要格式化扩展装对、默认设置配准、语言规则明确，保存即格式化的体验就很顺滑。