Отображение пути на вкладках файлов в коде Visual Studio

У меня есть структура папок на основе компонентов в моем проекте. Это набор папок с компонентами по одному файлу index.js.

Можно ли заставить Visual Studio Code отображать имя родительской папки на вкладках файлов? Или я ограничен тем, что вижу кучу вкладок, на которых все отображается index.js и ничего больше?

Enter image description here

Ответ 1

Теперь вы можете настроить код Visual Studio так, чтобы всегда показывать имена родительских папок на вкладках!

Вот как это выглядит с файлами init/views.js, init/routes.js и plugins/modal.js:

Enter image description here

Добавьте эту строку в настройки пользователя:

"workbench.editor.labelFormat": "short"

Примечание:

Еще один полезный инструмент для отображения точного пути к текущему файлу - использование breadCrumbs. Добавьте это в свои настройки пользователя:

"breadcrumbs.enabled": true

Screenshot of breadcrumbs


К вашему сведению: Чтобы открыть пользовательские настройки кода Visual Studio: Файл → Настройки → Настройки → Настройки пользователя. Чтобы просмотреть пользовательские настройки в формате JSON, нажмите значок "{}" в верхнем правом углу.

Ответ 2

В Visual Studio Code теперь улучшен пользовательский интерфейс с вкладками для решения этой проблемы.

Когда вы открыли несколько вкладок с одним и тем же именем файла, код Visual Studio автоматически отобразит родительское имя папки на каждой из этих вкладок.

Вот пример: я открыл event.js и два index.js файла. Visual Studio Code автоматически решает, что лучше показать имя папки index.js :)

Это в значительной степени решило основную часть моей проблемы.

Ответ 3

Перейдите в главное меню → Файл → Настройки → Настройки. И найдите (Cmd + F на Mac, Ctrl + F на Windows) формат метки рабочей среды.

Выберите короткий вариант.

Ответ 4

Я создал простой плагин кода Visual Studio, который принимает список регулярных выражений и цветов и изменяет titleBar/tabColor на их основе. Он отлично подходит для работы с монохранилищами или большими проектами с несколькими пакетами (например, Lerna или React + React Native).

ColorTabs