怎么让VSCode自动整理Import顺序_VSCode导入语句排序与自动整理-VSCode-PHP中文网

vscode里import排序不靠eslint或prettier，而是依赖import-sort（配合解析器和.importsortrc配置）或typescript内置organizeimports；前者支持自定义分组逻辑，后者仅基础字母排序。

怎么让vscode自动整理import顺序_vscode导入语句排序与自动整理

VSCode 里 import 排序靠的是 ESLint 或 Prettier 吗？

不是。ESLint 和 Prettier 都不负责 import 的**顺序重排**，它们最多能报错或格式化换行/空格。真正做 import 排序的，是 import-sort（配合插件）或 eslint-plugin-import 的 sort-imports 规则——但后者只检查、不自动修复顺序，除非你用 ESLint 的 --fix 并启用对应 fixer（支持有限）。

实际能「保存即自动重排 import」的稳定方案，目前只有：安装 import-sort + VSCode 插件 + 正确配置 .importsortrc。

怎么配 import-sort 让 VSCode 保存时自动排序？

分三步，缺一不可：

VSCode

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

下载

全局或项目本地安装 import-sort 和一个解析器，比如 import-sort-parser-typescript（TS 项目）或 import-sort-parser-babylon（JS）
在项目根目录放 .importsortrc，内容示例：
```
{
  "parser": "typescript",
  "style": "webpack",
  "groups": [
    ["^@?\w", "^@myorg/"],
    ["^\.", "^\$"]
  ]
}
```
其中 webpack 风格会把 import 'vue' 放最前，import '@/utils' 次之，import './foo' 在最后
VSCode 设置里开启保存时运行 import 排序：
```
"editor.codeActionsOnSave": {
  "source.organizeImports": true
}
```
注意：这个选项依赖语言服务器支持——TypeScript 项目开箱即用；JS 项目需确保 jsconfig.json 存在且 "typeAcquisition.enable": true

为什么保存没反应？常见卡点在哪？

多数失败不是配置错，而是环境没对齐：

import-sort 二进制没被 VSCode 找到：优先用 npm install --save-dev import-sort import-sort-parser-typescript 装本地版，避免全局命令路径问题
文件没被识别为 TS/JS：检查右下角语言模式是否是 TypeScript React 而非 Plain Text；.tsx 文件若没 tsconfig.json，TS 语言服务不会激活 organizeImports
用了 Prettier 冲突：Prettier 会覆盖 import 格式（如删空行），但它不改顺序。确保 prettier.config.js 里没设 "importOrder": []（那是 @trivago/prettier-plugin-sort-imports 的配置，和 import-sort 不兼容）
ESLint 的 sort-imports 规则开着但没加 /* eslint sort-imports: ["error", { "ignoreDeclarationSort": true }] */ 注释——它会和 import-sort 报重复错误

TS 项目推荐用内置 organizeImports 还是 import-sort？

VSCode 内置的 organizeImports（基于 TypeScript 语言服务）能删未使用 import、合并重复项、按字母排，但不支持自定义分组逻辑（比如“先 React，再第三方，再 @scope，再相对路径”）。如果你只要基础排序，不用装任何插件；如果要分组、加空行、按 scope 隔离，import-sort 是唯一靠谱选择。

顺带一提：import-sort 的 style 字段值（如 webpack、angular）只是预设规则名，实际行为由 groups 数组决定，别被名字误导——想改规则，直接调 groups 正则就行。