必须开启"explorer.fileNesting.enabled": true并配置"explorer.fileNesting.patterns"，如".service.ts": [".service.spec.ts", "*.service.html"]，父子文件需同目录、命名严格一致且大小写敏感。
为什么文件在资源管理器里散得满屏都是
VSCode 默认把所有文件平铺展示，user.service.ts、user.service.spec.ts、user.service.html 三个文件隔八行排开，找关联文件得反复滚动。这不是文件多的问题，是没激活“嵌套”逻辑。
核心解法就一条："explorer.fileNesting.enabled": true 必须打开，再配 "explorer.fileNesting.patterns" 明确告诉 VSCode 哪些文件该归到哪个父文件下面。
- 别只写
"*.service.ts": ["*.service.spec.ts"]，漏掉*.service.html或*.service.scss就白配了 - 模式匹配不支持通配符嵌套，
"*.component.*": ["*.component.*"]这种写法无效，必须拆成具体后缀 - Angular 项目建议加一行
"*.module.ts": ["*.module.ts"]，否则app.module.ts自己会缩进到自己下面（VSCode 的小 bug）
装了 File Nesting 插件却没反应
社区插件 File Nesting（meghadfar 开发）确实比原生更灵活，但它的规则不会自动覆盖 explorer.fileNesting.patterns，而是并存——而且优先级更低。
常见失效原因：
- 插件配置写在用户 settings.json 里，但你当前是工作区设置，插件只读工作区级的
.vscode/settings.json - 用了正则但没加
^和$，比如写"(.*)\.ts$": ["$1\.spec\.ts"]没生效，实际要写"^(.*)\.ts$": ["$1\.spec\.ts"] - 右键菜单里点 “Nest under…” 后，插件会往
.vscode/file-nesting.json写规则，但这个文件默认不被 Git 跟踪，换机器或重装就丢了
文件名不规范时嵌套直接失效
VSCode 文件嵌套本质是字符串匹配，不是语义识别。authService.ts 和 auth.service.spec.ts 不会自动关联，因为前缀不一致。
能被原生嵌套识别的命名，必须满足：
- 基础名完全相同：
user.service.ts↔user.service.spec.ts（中间不能多空格、下划线或大小写混用） - 后缀长度不影响，
api.client.ts可以匹配api.client.mock.ts，但apiClient.ts就不行 - 如果团队已用驼峰命名，别硬改，直接用 File Nesting 插件写正则：
"^([a-z]+[A-Z][a-zA-Z]*)\.ts$": ["$1\.spec\.ts"]
嵌套后标签页还是乱糟糟
资源管理器里文件看起来整齐了，但顶部标签页仍按打开顺序堆叠，user.service.ts 和 user.service.html 可能隔十来个标签——这跟嵌套无关，是标签页排序逻辑问题。
真正起作用的是这两项：
-
"workbench.editor.tabSizing": "shrink"：避免长文件名把其他标签挤出视野 -
"workbench.editor.wrapTabs": true：标签换行显示，比横向滚动更易定位 - 别依赖
"workbench.editor.sortOrder": "alphabetical"，它按全路径排序，src/app/user/user.service.ts和src/app/user/user.service.html会被分到不同区块
最实在的做法：关掉不用的标签页，用 Ctrl+Tab 切换最近访问的几个文件——嵌套解决的是“找”，不是“留”。
