logo标签列表

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

visual-studio-code
138

我在项目中使用了基于组件的文件夹结构，其中包含许多具有一个 index.js 文件的组件文件夹。

是否有可能使Visual Studio Code在文件标签中显示父文件夹名称？或者我只能看到一堆都显示 index.js 但没有其他信息的标签？

这里是图片描述

这里有一个关于它的线程：https://github.com/Microsoft/vscode/issues/8499 - Anish
5
此设置将在标题栏中显示完整路径（但不包括选项卡）：“window.title”: “${activeEditorLong}${separator}${rootName}” - edan
${activeEditorMedium}${separator}${rootName} 在我看来更好，我不认为需要查看整个文件路径，而不是从 src 根目录开始的路径。 - Siddhartha
8个回答
273
你可以配置Visual Studio Code，使其在选项卡中始终显示父文件夹名称！只需在你的“用户设置”中添加以下行："workbench.editor.labelFormat": "short"（其他值为"long"、"medium"或"default"）。
结果：文件init/views.js、init/routes.js和plugins/modal.js将被呈现为如下形式：

Screenshot of Visual Studio Code file tabs

另一个选项是用户设置"breadcrumbs.enabled": true，它会在代码视图中的活动选项卡下方显示完整文件路径的面包屑导航栏。

Screenshot of breadcrumbs

PS: 要打开用户设置，请使用文件菜单→首选项→设置→用户设置。要以JSON格式查看设置，只需点击右上角的{}图标。

29

前往主菜单：文件 → 首选项 → 设置，并搜索 (Mac 上的 Cmd + F; Windows 和 Linux 上的 Ctrl + F) 工作台标签格式。

选择短选项。

对于版本1.45（2020-04）。 - Peter Mortensen
第二个选项有不同的选项，分别是“内容”和“名称”。 - Peter Mortensen
也许使用一个能够得到单个结果的搜索词会更好（目前有10个结果）？ - Peter Mortensen
1
用引号括起来可以将命中数从34个减少到7个（版本1.45.1，2020-05-14）：“工作台标签格式”。 - Peter Mortensen
1
通过输入（或粘贴）设置 ID：workbench.editor.labelFormat，可以使搜索变得唯一（仅一个搜索匹配）。 - Peter Mortensen
显示剩余2条评论
8
7
Visual Studio Code现在已经改进了他们的标签界面来解决这个问题。
当你打开多个具有相同文件名的标签时，Visual Studio Code会自动在每个标签中显示父文件夹的名称。
这是一个例子：我打开了两个`index.js`文件和一个`event.js`文件。VsCode决定为`index.js`文件显示文件夹名称，但对于`event.js`文件不显示文件夹名称，因为该文件名是唯一的。

这在某些情况下对我来说已经足够了（当我有很多文件都有相同的名称时）。
9
还有一个设置可以控制标签的行为和格式："workbench.editor.labelFormat" - Ej.
4

步骤1：转到文件 > 首选项 > 设置

步骤2：搜索“workbench.editor.labelFormat”

步骤3：从下拉菜单中选择medium

2

视频参考代码Grepper

打开VS Code设置，搜索"标签格式" 你会看到

工作台 › 编辑器：标签格式 控制编辑器标签的格式。

将默认值更改为简短。

0

您可以安装nice-index扩展程序，以更好地处理索引文件。

然而，目前它只在您打开多个索引文件时才能工作。这可以通过将labelFormat更改为“short”，如其他答案所建议的那样来解决。

1
该链接导致了一个 404 错误页面。 - xperator
似乎插件已经停止更新了。我几个月前就停止使用它了，而且干脆不再使用索引文件，因为这让我很难区分哪个标签页对应哪个文件，非常令人头疼。 - Vitexikora
-1
在 VSCode 1.53 中，您可以使用以下设置：
控制窗口标题基于活动编辑器。变量根据上下文进行替换：
${activeEditorShort}: the file name (e.g. myFile.txt).
${activeEditorMedium}: the path of the file relative to the workspace folder (e.g. myFolder/myFileFolder/myFile.txt).
${activeEditorLong}: the full path of the file (e.g. /Users/Development/myFolder/myFileFolder/myFile.txt).
${activeFolderShort}: the name of the folder the file is contained in (e.g. myFileFolder).
${activeFolderMedium}: the path of the folder the file is contained in, relative to the workspace folder (e.g. myFolder/myFileFolder).
${activeFolderLong}: the full path of the folder the file is contained in (e.g. /Users/Development/myFolder/myFileFolder).
${folderName}: name of the workspace folder the file is contained in (e.g. myFolder).
${folderPath}: file path of the workspace folder the file is contained in (e.g. /Users/Development/myFolder).
${rootName}: name of the opened workspace or folder (e.g. myFolder or myWorkspace).
${rootPath}: file path of the opened workspace or folder (e.g. /Users/Development/myWorkspace).
${appName}: e.g. VS Code.
${remoteName}: e.g. SSH
${dirty}: a dirty indicator if the active editor is dirty.
${separator}: a conditional separator (" - ") that only shows when surrounded by variables with values or static text.
2
虽然这很有用，但与问题无关，问题是关于设置编辑器选项卡的标题。 - Théophile
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接