VS Code: работа с файлами и папками

Работа с файлами в VS Code — создание, переименование, удаление и навигация по файловой системе проекта через Explorer, Command Palette и горячие клавиши.

Зачем нужно

Быстрая навигация по файлам проекта — основа продуктивности. VS Code предоставляет fuzzy-поиск по имени файла, поиск символов, breadcrumbs и интегрированный Explorer. Умение перемещаться без мыши значительно ускоряет разработку.

Где используется

  • Ежедневная работа с любым проектом
  • Переименование файлов с автоматическим обновлением импортов (TypeScript)
  • Сравнение версий файлов (diff view)
  • Multi-root workspace — несколько папок в одном окне

Explorer — боковая панель

Ctrl+Shift+E        — открыть Explorer

В Explorer:
  N / клик ПКМ → New File          — создать файл
  Shift+N            — создать папку
  F2 или двойной ПКМ — переименовать
  Delete             — удалить (в корзину)
  Ctrl+C → Ctrl+V    — копировать/вставить
  Перетаскивание     — переместить

Быстрый доступ к файлам

Ctrl+P             — открыть файл по имени (fuzzy search)
  Введите часть имени: "usr svc" найдёт "UserService.ts"
  @ → переход к символу в файле
  : → перейти к строке
  > → команда (то же что Ctrl+Shift+P)

Ctrl+Shift+O       — символы в текущем файле (функции, классы)
Ctrl+T             — символы по всему проекту

Вкладки и группы

Ctrl+W             — закрыть текущую вкладку
Ctrl+Shift+T       — восстановить закрытую вкладку
Ctrl+Tab           — переключение по вкладкам
Ctrl+1 / 2 / 3    — фокус на группу редакторов
Ctrl+\             — разделить редактор (split view)
Ctrl+K → W         — закрыть все вкладки группы

Поиск по всем файлам

Ctrl+Shift+F       — поиск по содержимому всех файлов
  В поиске:
  .*               — регулярные выражения (Alt+R)
  Aa               — учитывать регистр (Alt+C)
  [abc]            — целые слова (Alt+W)
  Include: src/    — искать только в папке src/
  Exclude: *.test.ts — исключить тесты

Переименование файла с обновлением импортов

TypeScript проект:
1. F2 на имени файла в Explorer → переименовать
2. VS Code предложит обновить все импорты автоматически
3. Нажать "Yes" — все `import ... from './OldName'` обновятся

Или в settings.json:
"javascript.updateImportsOnFileMove.enabled": "always"
"typescript.updateImportsOnFileMove.enabled": "always"

Сравнение файлов (Diff)

1. ПКМ на файл в Explorer → "Select for Compare"
2. ПКМ на другой файл → "Compare with Selected"

Или через git: ПКМ на изменённый файл → "Open Changes"
Горячие клавиши в diff view:
  Alt+F5 / Shift+Alt+F5 — следующее/предыдущее изменение

.gitignore и file exclusion

// settings.json — файлы скрытые в Explorer (но не из поиска)
{
  "files.exclude": {
    "**/.git": true,
    "**/node_modules": true,
    "**/*.js.map": true
  },
  // Исключить из поиска
  "search.exclude": {
    "**/node_modules": true,
    "**/dist": true
  }
}

Частые ошибки

  • Удаление файла без обновления импортов — TypeScript-ошибки по всему проекту
  • Не знают Ctrl+P — ищут файлы мышью в дереве папок
  • Путают Explorer (файлы) и Search (содержимое файлов)
  • Открывают VS Code на конкретном файле, а не на папке проекта — нет IntelliSense

Связанные темы

Ресурсы