如何自定义VSCode实现类似Visual Studio Solution Explorer的文件视图体验？

绝对可以实现！我之前也被VSCode自带的扁平化Open Editors视图坑过——一堆同名的view.html根本分不清哪个是哪个，来回切换面板也超麻烦。下面给你几个亲测好用的方案，完美匹配你想要的“在工作区视图切换全部/已打开文件”的需求：

方案一：用专用扩展快速解决 #

这是最省心的方法，直接装现成的扩展就能搞定：

• Open Files in Tree：这个扩展会在侧边栏新增一个树形视图，专门展示已打开的文件，而且完整保留目录层级结构，和你熟悉的VS Solution Explorer逻辑一模一样。打开新文件时视图会自动同步，还能直接在树形结构里跳转、关闭文件，体验丝滑。
• Workspace Explorer：功能更全面的扩展，不仅支持已打开文件的树形过滤，还能自定义其他过滤规则（比如待修改文件、特定类型文件）。它允许你在同一个侧边栏视图里快速切换“全部文件”“已打开文件”等不同模式，完全替代原生资源管理器的部分功能。

方案二：自定义快捷键+原生过滤（不用装扩展） #

VSCode原生其实就支持在资源管理器里过滤已打开文件，只是默认没暴露快捷方式，我们可以自己配置：

1. 打开快捷键设置（按下Ctrl+K Ctrl+S，Mac是Cmd+K Cmd+S）；
2. 搜索files.focusExplorerView，给它绑定一个快捷键，比如Ctrl+Shift+O；
3. 再添加一个快捷键规则，当资源管理器已经显示时，自动输入open:过滤已打开文件：
   打开settings.json（按下Ctrl+Shift+P输入Preferences: Open Settings (JSON)），添加以下配置：

   [
     {
       "key": "ctrl+shift+o",
       "command": "files.focusExplorerView",
       "when": "!explorerViewletVisible"
     },
     {
       "key": "ctrl+shift+o",
       "command": "workbench.action.findInExplorer",
       "args": "open:",
       "when": "explorerViewletVisible"
     }
   ]
   

   配置完成后，按一次Ctrl+Shift+O会切换到资源管理器并自动过滤出已打开的树形文件；再按一次或者按下Esc就能清空过滤，回到全部文件视图，完全不用切换面板。

方案三：自定义扩展（适合有开发基础的同学） #

如果上面的方案都不能完全满足你的定制需求，你可以自己写一个简单的VSCode扩展。利用VSCode的API，你可以监听已打开文件的变化，然后构建一个自定义的树形视图：

• 用window.onDidChangeActiveTextEditor和workspace.textDocuments获取当前已打开的所有文件；
• 用TreeView API将这些文件按目录层级组织起来；
• 给视图添加一个切换按钮，实现“全部文件/已打开文件”的快速切换。

总的来说，方案一和方案二都能快速解决你的问题，推荐先试试扩展，省心又好用！

内容的提问来源于stack exchange，提问作者Chris Moutray