7 способов изменить отображаемый каталог в верхней панели кода VS

Visual Studio Code (VS Code) — популярный редактор кода, предоставляющий широкий спектр возможностей настройки. Одной из таких настроек является возможность изменить отображаемый каталог на верхней панели. По умолчанию VS Code показывает путь к текущему активному файлу, но с помощью нескольких простых методов вы можете изменить это поведение, чтобы отображать каталог по вашему выбору. В этой статье мы рассмотрим семь различных методов вместе с примерами кода для изменения отображаемого каталога в верхней панели VS Code.

Метод 1: использование файла конфигурации рабочей области
Файл конфигурации рабочей области позволяет вам определить настройки, специфичные для конкретной рабочей области. Чтобы изменить отображаемый каталог, выполните следующие действия:

  1. Откройте корневую папку вашего рабочего пространства в VS Code.
  2. Создайте новый файл с именем «.vscode/settings.json», если он еще не существует.
  3. Добавьте следующий код в файл settings.json: 
    {
"window.title": "${workspaceFolderBasename}"
}
  4. Сохраните файл.

Метод 2: использование палитры команд VS Code
Палитра команд в VS Code обеспечивает быстрый доступ к различным командам. Чтобы изменить отображаемый каталог с помощью палитры команд:

  1. Нажмите «Ctrl+Shift+P» (Windows/Linux) или «Cmd+Shift+P» (Mac), чтобы открыть палитру команд.
  2. Введите «Настройки: настройки открытой рабочей области» и выберите его.
  3. В редакторе настроек добавьте следующий код: 
    "window.title": "${workspaceFolderBasename}"
  4. Сохраните файл.

Метод 3: использование пользовательских настроек VS Code
Вы также можете изменить пользовательские настройки, чтобы изменить отображаемый каталог глобально в VS Code. Вот как:

  1. Нажмите «Ctrl+» (Windows/Linux) или «Cmd+» (Mac), чтобы открыть настройки пользователя.
  2. Добавьте следующий код в файл settings.json: 
    "window.title": "${workspaceFolderBasename}"
  3. Сохраните файл.

Метод 4: использование расширения (Path Intellisense)
Расширение Path Intellisense обеспечивает улучшенные функции автозаполнения пути к файлу и навигации в VS Code. Чтобы изменить отображаемый каталог с помощью этого расширения:

  1. Установите расширение Path Intellisense из магазина VS Code.
  2. Откройте настройки расширения, нажав на значок шестеренки на боковой панели «Расширения» и выбрав «Настройки расширения».
  3. Найдите параметр «Путь Intellisense: корневая папка» и укажите каталог, который вы хотите отображать на верхней панели.
  4. Сохраните настройки.

Метод 5. Использование расширения (Customize UI)
Расширение Customize UI позволяет настраивать различные аспекты пользовательского интерфейса VS Code, включая верхнюю панель. Чтобы изменить отображаемый каталог с помощью этого расширения:

  1. Установите расширение Customize UI из магазина VS Code.
  2. Откройте настройки расширения, нажав на значок шестеренки на боковой панели «Расширения» и выбрав «Настройки расширения».
  3. Сохраните настройки.

Метод 6: использование расширения (расширенный режим)
Расширение расширенного режима обеспечивает ряд визуальных улучшений для VS Code, включая возможность настройки верхней панели. Чтобы изменить отображаемый каталог с помощью этого расширения:

  1. Установите расширение Power Mode из магазина VS Code.
  2. Откройте настройки расширения, нажав на значок шестеренки на боковой панели «Расширения» и выбрав «Настройки расширения».
  3. Сохраните настройки.

Метод 7: использование расширения (пользовательский загрузчик CSS и JS)
Расширение Custom CSS и JS Loader позволяет внедрять собственный код CSS и JavaScript в VS Code. Чтобы изменить отображаемый каталог с помощью этого расширения:

  1. Установите расширение Custom CSS и JS Loader из магазина VS Code.
  2. Создайте файл CSS и добавьте следующий код, чтобы указать верхнюю панель и изменить отображаемый каталог: 
    /* CSS code */
.monaco-workbench .part.title .label-name {
visibility: hidden;
}
.monaco-workbench .part.title .label-name::before {
content: "Your Custom Directory";
visibility: visible;
}
  3. Настройте расширение для загрузки файла CSS в VS Code.
  4. Сохраните настройки.

В этой статье мы рассмотрели семь различных способов изменения отображаемого каталога в верхней панели VS Code. Предпочитаете ли вы изменить файл конфигурации рабочей области, использовать палитру команд, настроить пользовательские настройки или использовать различные расширения, существует множество опций для настройки отображения каталога в VS Code в соответствии с вашими предпочтениями. Поэкспериментируйте с этими методами и найдите тот, который лучше всего подходит для вашего рабочего процесса.