关键配置是 editor.formatonsave 设为 true,但需配合对应语言的格式化插件(如 eslint 或 prettier)才能生效;import 排序须依赖 eslint 的 import/order 规则或 prettier 插件,且需开启 eslint.codeaction.onsave.mode: all 才能保存时自动修复。

保存时自动格式化代码用哪个配置项
关键就一个:把 editor.formatOnSave 设为 true。它控制所有语言的保存即格式化开关,但本身不决定“怎么格式化”——具体行为由当前文件类型的默认格式化器(formatter)决定。
常见错误是只开了这个,却没装对应语言的格式化插件,结果保存后啥都没变。比如写 TypeScript,没装 ESLint 或 Prettier 插件,formatOnSave 就只是个摆设。
- VS Code 设置路径:
Settings > Text Editor > Formatting > Format On Save - 推荐在工作区设置(
.vscode/settings.json)里写死,避免和别人环境不一致:"editor.formatOnSave": true
- 如果只想对某类文件生效(比如只格式化
.ts),用[typescript]语言专属设置
自动排序 import 语句靠什么插件
VS Code 自带的格式化器(如内置的 TypeScript 格式化器)**不处理 import 排序**。必须依赖第三方插件,主流就两个:ESLint 和 Prettier,但它们角色不同:
-
Prettier默认不碰 import —— 它专注代码风格(缩进、引号、换行),要让它排序 import,得加插件@prettier/plugin-import-sort,再配规则 -
ESLint配合eslint-plugin-import的import/order规则,才是最常用、最可控的方式 - 两者混用容易打架:比如 ESLint 报 import 顺序错,Prettier 又按自己逻辑重排 —— 建议二选一,优先选 ESLint 方案
实操建议:装好 ESLint 插件 + 在项目根目录放 .eslintrc.js,启用 import/order 并指定排序组(如先标准库,再三方,再本地)。
为什么保存后 import 没排序,但手动运行 ESLint 却可以
大概率是没打开 ESLint 的“保存时修复”功能。VS Code 的 ESLint 插件默认只做校验,不自动修——得显式开启 eslint.codeAction.onSave.mode。
- 设置项是
eslint.codeAction.onSave.mode,值设为all(不是problems) - 同时确保
editor.codeActionsOnSave包含source.fixAll.eslint - 注意:如果项目里有
.eslintignore或overrides配置,可能让某些文件被跳过检查 - 验证方法:保存后看右下角有没有“ESLint fixing…”提示;没有,说明没触发修复流程
多语言项目里 import 排序规则怎么统一
JS/TS/JSX 文件可以用同一套 ESLint import/order 规则,但 Python、Go 等语言得另配——VS Code 不跨语言复用同一套 import 逻辑。
- TypeScript 项目中,
import/order对import type和普通import默认分开排序,需用groups显式合并 - React 项目常遇到
react/import-order这种社区扩展规则,它比原生import/order更懂组件导入习惯 - 如果用了 Prettier,记得关掉它的
importOrder相关选项,否则和 ESLint 冲突;冲突表现是保存两次才稳定,或顺序来回跳
真正麻烦的是混合栈项目(比如前端用 TS + 后端用 Go):Go 的 import 排序由 gofmt 控制,和 ESLint 完全无关,得靠语言服务器单独配 editor.formatOnSave 触发 gofmt —— 别指望一个配置打天下。











