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 配置
基本上就这些。只要格式化扩展装对、默认设置配准、语言规则明确,保存即格式化的体验就很顺滑。










