在Visual Studio代码中显示文件选项卡中的路径

Question

我的项目中有一个基于组件的文件夹结构。它是一堆组件文件夹，每个文件夹有一个index.js文件。

是否可以使Visual Studio代码在文件选项卡中显示父文件夹名称？或者我是否仅限于看到一堆显示所有显示index.js的标签而没有别的？

Answer 1

现在，您可以将Visual Studio代码配置为始终在选项卡中显示父文件夹名称！

这就是文件init/views.js，init/routes.js和plugins/modal.js的样子：

将此行添加到用户设置：

"workbench.editor.labelFormat": "short"

---

边注：

显示当前文件的确切文件路径的另一个有用工具是使用breadCrumbs。将其添加到您的用户设置：

"breadcrumbs.enabled": true

---

仅供参考：打开Visual Studio代码用户设置：文件→首选项→设置→用户设置。要以JSON格式查看用户设置，请点击右上角的“{}”图标。

Answer 2

Visual Studio Code现在已经改进了tab-UI来解决此问题。

当您打开具有相同文件名的多个选项卡时，Visual Studio代码将自动在每个选项卡中显示父foldername。

这是一个例子：我打开了event.js和两个index.js文件。 Visual Studio Code自动决定显示index.js文件的foldername是个好主意:)

它几乎解决了我的大部分问题。

Answer 3

转到主菜单→文件→首选项→设置。并搜索（Mac上的Cmd + F，Windows上的Ctrl + F）工作台标签格式。

选择短选项。

Answer 4

我创建了一个简单的Visual Studio Code插件，它接受一个正则表达式和颜色列表，并根据它们更改titleBar / tabColor。它非常适合处理单个存储库或具有多个包的大型项目（如Lerna或React + React Native）。

ColorTabs