Visual Studio Code Docs Ru

Обзор

Установка

Обзор

Linux

Mac

Windows

Доп. компоненты

Быстрый старт

Вводные видео

Интерфейс

Темы

Настройки

Горячие клавиши

Язык интерфейса

Руководство пользователя

Базовое редактирование

Расширения Marketplace

Автодополнение

Код навигатор

Отладка

Управление версиями

Встроенный терминал

Задачи

Создание своих сниппетов

Командная строка

Доступность

Языки

Обзор

JavaScript

JSON

HTML

CSS, Sass and Less

TypeScript

Markdown

PHP

Python

Go

Dockerfile

T-SQL

C#

C++

Node.js  / JavaScript

Node.js руководство

Node,js отладка

Node.js деплой

React руководство

Angular руководство

Расширения

Создание расширений

Обзор

Генератор расширений

Пример - Hello World

Пример - Word Count

Пример - Language Server

Пример - Debuggers

Темы, сниппеты и оформление

Доп. примеры

Запуск и отладка расширений

Публикация расширений

Тестирование расширений

Расширяемость

Обзор

Принципы и шаблоны

Руководство по яз. расширениям

Расширения - таблица

Важные точки

События активации

Пространство имен

Комплексные команды

Отладка API

Управление и контроль

Другое

Ядро .NET

Unity Development

Office Add-ins

Пользовательский интерфейс

По сути, Visual Studio Code является редактором кода. Как и многие другие редакторы кода, VS Code использует общий пользовательский интерфейс и макет проводника слева, показывая все файлы и папки, к которым у вас есть доступ, и редактор справа, показывающий содержимое файлов, которые вы открыли.

Файлы, папки и проекты

VS Code основан на файлах и папках - вы можете сразу начать работу, открыв файл или папку в VS Code.

 

Кроме того, VS Code может читать и использовать различные файлы проектов, определенные различными платформами. Например, если папка, которую вы открыли в VS Code содержит один или несколько пакетов package.json, project.json, tsconfig.json или .NET Core Visual Studio и файлы проектов, VS Code будет читать эти файлы и использовать их для предоставления дополнительных возможностей, например, богатый автодополнение в редакторе.

Базовая компоновка

VS Code поставляется с простой и интуитивно понятной компоновкой, которая максимизирует пространство, предоставляемое редактору, оставляя достаточно места для просмотра и доступа к полному контексту вашей папки или проекта. Пользовательский интерфейс разделен на пять областей:

 

  • Редактор - основная область для редактирования ваших файлов. Вы можете открыть до трех редакторов рядом друг с другом.
  • Side Bar - Содержит различные виды, такие как проводник, чтобы помочь вам при работе над вашим проектом.
  • Строка состояния - информация об открытом проекте и файлах, которые вы редактируете.
  • Панель активности - Расположенная на крайнем левом углу, это позволяет переключаться между представлениями и дает дополнительные индикаторы контекста, такие как количество исходящих изменений при включении Git.
  • Панели - Вы можете отображать различные панели под областью редактора для вывода или отладки информации, ошибок и предупреждений или встроенного терминала.

 

Каждый раз, когда вы запускаете VS Code, он открывается в том же состоянии, в котором он находился, когда вы последний раз закрыли его. Папка, макет и открытые файлы сохраняются.

Открытые файлы в каждом редакторе отображаются с вкладками заголовков (вкладки) в верхней части области редактора. Чтобы узнать больше о заголовках с вкладками, см. Раздел Вкладки ниже.

Совет: Вы можете переместить боковую панель в правую сторону (Вид > Переместить боковую панель справа) или переключить ее видимость (Ctrl + B).

Рабочие области

У вас может быть до трех рабочих областей, открытых бок о бок. Если у вас уже открыта одна рабочая область, существует несколько способов открытия другой области в стороне от существующей:

 

  • Ctrl (Mac: Cmd) щелкните по файлу в проводнике.
  • Ctrl + \, чтобы разделить активный редактор на два.
  • Откройте в стороне из контекстного меню проводника в файле.
  • Нажмите кнопку разделить редактор в правом верхнем углу редактора.
  • Перетащите файл в обе стороны области редактора.
  • Ctrl + Enter (Mac: Cmd + Enter) в списке файлов быстрого доступа (Ctrl + P).

Каждый раз, когда вы открываете другой файл, активная область отображает содержимое этого файла. Поэтому, если у вас есть два области рядом друг с другом, и вы хотите открыть файл foo.cs в редакторе справа, убедитесь, что область активна (щелкнув внутри нее) перед открытием файла 'foo.cs'.

 

Когда у вас открыто несколько областей, вы можете быстро переключаться между ними, удерживая клавишу Ctrl (Mac: Cmd) и нажав 1, 2 или 3.

Совет: Вы можете изменить размеры областей и переупорядочить их. Перетащите область заголовка редактора, чтобы изменить размер области.

Мини-карта - общий вид

Мини-карта (общий вид) дает вам краткий обзор исходного кода, который очень полезен для быстрой навигации и понимания кода. Мини-карта файла показана в правой части редактора. Вы можете щелкнуть или задрапировать заштрихованную область, чтобы быстро перейти к различным разделам вашего файла.

Если вы хотите отключить мини-карту, вы можете установить "editor.minimap.enabled": false в настройках пользователя или рабочей области.

Линии отступов

На изображении выше также показаны направляющие отступа (вертикальные линии), которые помогут вам быстро увидеть соответствующие уровни отступа. Если вы хотите отключить направляющие отступа, вы можете установить "editor.renderIndentGuides": false в настройках вашего пользователя или рабочей области.

Проводник

Проводник используется для просмотра, открытия и управления всеми файлами и папками в вашем проекте.

 

После открытия папки в VS Code содержимое папки отображается в Проводнике. Вы можете сделать много вещей отсюда:

 

  • Создавайте, удаляйте и переименовывайте файлы и папки.
  • Перемещайте файлы и папки с помощью перетаскивания.
  • Используйте контекстное меню, чтобы изучить все параметры.

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

VS Code очень хорошо работает с другими инструментами, которые вы можете использовать, особенно с инструментами командной строки. Если вы хотите запустить средство командной строки в контексте папки, которую вы сейчас открыли в VS Code, щелкните правой кнопкой мыши папку и выберите Открыть в командной строке (или Открыть в терминале на Mac или Linux»).

 

Вы также можете перейти к местоположению файла или папки в основном проводнике, щелкнув правой кнопкой мыши на файле или папке и выбрав Показать в проводнике (или Показать в Finder на Mac или Открыть содержащую папку в Linux).

Совет: Нажмите Ctrl + P (Quick Open), чтобы быстро найти и открыть файл по его названию.

По умолчанию VS Code исключает некоторые папки из проводника (например .git). Используйте параметр files.exclude, чтобы настроить правила для скрытия файлов и папок из проводника.

 

Совет: Это действительно полезно, чтобы скрыть файлы производных ресурсов, такие как \ *.Meta в Unity или \ *. Js в проекте TypeScript. Для Unity, чтобы исключить файлы \ *. Cs.meta, шаблон для выбора будет: "** / *. Cs.meta": true. Для TypeScript вы можете исключить сгенерированный JavaScript для файлов TypeScript с помощью: "** / *. Js": {"when": "$ (basename) .ts"}.

Открытые редакторы

В верхней части Проводника находится раздел с надписью Открытые редакторы. Это список активных файлов или предварительный просмотр. Это файлы, которые вы ранее открывали в VS Code, над которым вы работаете. Например, файл будет указан в разделе ОТКРЫТЫЕ РЕДАКТОРЫ, если вы:

 

  • Внесли изменения в файл.
  • Дважды щелкнули заголовок файла.
  • Дважды щелкните файл в проводнике.
  • Открыли файл, который не является частью текущей папки.

 

Просто нажмите элемент в разделе ОТКРЫТЫЕ РЕДАКТОРЫ, и он станет активным в VS Code.

 

Как только вы закончите свою задачу, вы можете удалить файлы отдельно из раздела ОТКРЫТЫЕ РЕДАКТОРЫ, или вы можете удалить все файлы с помощью  Вид: Закрыть все редакторы или Вид: закрыть всех редакторов в действиях группы.

Вид и панель активности

Проводник файлов - это только один из видов, доступных в VS Code. Есть также:

 

  • Поиск - Обеспечивает глобальный поиск и замену в открытой папке.
  • Source Control - VS Code включает в себя управление версиями Git по умолчанию.
  • Отладка - просмотр отладки VS Code отображает переменные, стеки вызовов и точки останова.
  • Расширения - Устанавливайте и управляйте своими расширениями в VS Code.

 

Панель активности слева позволяет быстро переключаться между представлениями. Вы также можете изменить порядок просмотров, перетащив их на панель активности или полностью удалить вид (щелкните правой кнопкой мыши Удалить из панели действий).

Палитра команд

VS Code одинаково доступен с клавиатуры. Наиболее важная комбинация клавиш - Ctrl + Shift + P, которая вызывает командную палитру. Отсюда вы получаете доступ ко всем функциям VS Code, включая сочетания клавиш для наиболее часто используемых операций.

Палитра команд обеспечивает доступ ко многим командам. Вы можете выполнять команды редактора, открывать файлы, искать символы и просматривать быстрый контур файла, используя одно и то же интерактивное окно. Вот несколько советов:

 

  • Ctrl + P позволит вам перейти к любому файлу или символу, набрав его имя
  • Ctrl + Shift + Tab проведет вас через последний набор открываемых файлов
  • Ctrl + Shift + P приведет вас непосредственно к командам редактора
  • Ctrl + Shift + O позволит вам перейти к определенному символу в файле
  • Ctrl + G позволит вам перейти к определенной строке в файле

 

Введите ? в поле ввода, чтобы получить список доступных команд, которые вы можете выполнить здесь:

Настройка редактора

VS Code дает вам много возможностей для настройки редактора. В меню Вид вы можете скрыть или переключить различные части пользовательского интерфейса, такие как боковая панель, строка состояния и панель активности.

Скрыть панель меню (Windows, Linux)

Вы можете скрыть панель меню в Windows и Linux с помощью команды Вид > Переключить панель меню Вы все равно можете получить доступ к строке меню, нажав клавишу Alt (настройка window.menuBarVisibility)

Настройки

Большинство конфигураций редактора хранятся в настройках, которые могут быть изменены напрямую. Вы можете устанавливать параметры по всему миру с помощью пользовательских настроек или для каждого проекта / папки через настройки рабочей области. Значения настроек хранятся в файле settings.json.

 

  • Выберите Файл > Настройки > Настройки (или нажмите Ctrl + Shift + P, введите user и нажмите Enter), чтобы отредактировать файл user settings.json.

 

  • Чтобы изменить параметры рабочей области, выберите Файл > Установки > Настройки и выберите вкладку НАСТРОЙКИ WORKSPACE (или нажмите Ctrl + Shift + P, введите worksp и нажмите Enter), чтобы отредактировать файл настроек рабочего пространства.

Примечание: для пользователей Mac: меню Настройки находится в разделе Код, не файл. Например, Код> Настройки> Настройки.

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

 

После редактирования ваших настроек введите Ctrl + S, чтобы сохранить изменения. Изменения вступят в силу немедленно.

Примечание: Параметры рабочей области переопределяют пользовательские настройки и полезны для совместного использования конкретных параметров проекта в команде.

Дзэн режим

Дзэн режим позволяет вам сфокусироваться на вашем коде, скрывая все пользовательские интерфейсы, кроме редактора (без панели действий, строки состояния, боковой панели) и перехода в полноэкранный режим. Дзэн режим можно переключать с помощью меню Вид, Палитра команд или сочетанием клавиш Ctrl + K Z. Двойное нажатие Esc выходит из дзэн режима. Переход в полноэкранный режим можно отключить с помощью zenMode.fullScreen. Дзэн режим можно дополнительно настроить следующими настройками: zenMode.hideStatusBar, zenMode.hideTabs, zenMode.fullScreen и zenMode.restore.

Заголовки

Visual Studio Code показывает открытые позиции с вкладками (заголовками с вкладками) в области заголовка над редактором.

 

Когда вы открываете файл, для этого файла добавляется новая вкладка.

Вкладки позволяют быстро перемещаться между элементами, и вы можете перетаскивать вкладки, чтобы переупорядочить их.

 

Когда у вас есть больше открытых элементов, чем может поместиться в области заголовка, вы можете использовать команду Показать открытые редакторы (доступную через кнопку еще ...), чтобы отобразить раскрывающееся меню с вкладками.

 

Если вы не хотите использовать вкладки, вы можете отключить эту функцию, установив для параметра workbench.editor.showTabs значение false:

"workbench.editor.showTabs": false

См. Раздел ниже, чтобы оптимизировать VS Code при работе без вкладок.

Открытие вкладок

По умолчанию новые вкладки добавляются справа от существующих вкладок, но вы можете контролировать, где вы хотите, чтобы новые вкладки отображались с настройкой workbench.editor.openPosition.

 

Например, вам можете показать открытие новых элементов с вкладками слева:

"workbench.editor.openPositioning": "left"

Режим предварительного просмотра

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

 

Режим предварительного просмотра обозначается курсивом в заголовке вкладки:

Если вы предпочитаете не использовать режим предварительного просмотра и всегда создавать новую вкладку, вы можете управлять поведением с помощью этих настроек:

 

  • Workbench.editor.enablePreview для глобального включения или отключения редакторов предварительного просмотра
  • Workbench.editor.enablePreviewFromQuickOpen для включения или отключения редакторов предварительного просмотра при открытии из Quick Open

Группы редакторов

Когда вы разделяете редактор (используя команды Разделить редактор или Открыть в новой области), создается новая область редактора, которая может содержать группу элементов. VS Code позволяет использовать до трех областей, которые обозначены как LEFT, CENTER и RIGHT.

 

Вы можете увидеть их в разделе ОТКРЫТЫЕ РЕДАКТОРЫ в верхней части окна проводника:

Вы можете перетаскивать области, перемещать отдельные вкладки между группами и быстро закрывать целые группы (Закрыть все).

Примечание: VS Code использует области независимо от того, включены ли вкладки. Без вкладок области представляют собой стек ваших открытых элементов с самым последним выбранным элементом, видимым в области редактора.

Горизонтальная компоновка

По умолчанию области размещаются в трех вертикальных столбцах. Если вы предпочитаете, вы можете изменить макет на три горизонтальные строки с областями, обозначенными как TOP, CENTER и BOTTOM.

 

Вы можете переключать компоновку группы редакторов между вертикальной и горизонтальной плоскостями:

 

  • Вид > Переключить структуру группы редакторов.
  • Вид: Переключить структуру группы редакторов / Компановку в палитре команд (Ctrl + Shift + P)
  • Кнопка переключения на панели инструментов Открыть редакторы
  • Сочетание клавиш: Shift + Alt + 1

Горячие клавиши

Вот несколько удобных сочетаний клавиш, чтобы быстро перемещаться между редакторами и областями.

Если вы хотите изменить стандартные сочетания клавиш, см. Раздел Сочетания клавиш.

  • Ctrl + PageDown перейдите в правый редактор.
  • Ctrl + PageUp перейдите в левый редактор.
  • Ctrl + Tab откройте следующий редактор в списке групп редактора MRU.
  • Ctrl + Shift + Tab открыть предыдущий редактор в списке групп редактора MRU.
  • Ctrl + 1 перейдите в самую левую редакционную группу.
  • Ctrl + 2 перейдите в группу центра редактирования.
  • Ctrl + 3 перейдите в правую редакционную группу.
  • Ctrl + K Ctrl + Left перейти к предыдущей группе редакторов.
  • Ctrl + K Ctrl + Right переход к следующей группе редакторов.
  • Ctrl + F4 закрыть активный редактор.
  • Ctrl + K W закрыть все редакторы в группе редакторов.
  • Ctrl + K Ctrl + W закрыть все редакторы.

Работа без вкладок

Если вы предпочитаете не использовать вкладки (заголовки с вкладками), вы можете полностью отключить вкладки (заголовки с вкладками), установив для параметра workbench.editor.showTabs значение false.

Отключить режим предварительного просмотра

Без вкладок раздел ОТКРЫТЫХ РЕДАКТОР File Explorer - это быстрый способ навигации по файлам. В режиме предварительного просмотра файлы не добавляются в список ОТКРЫТОГО РЕДАКТОРА или группу редакторов при открытии одного щелчка. Вы можете отключить эту функцию с помощью параметров workbench.editor.enablePreview и workbench.editor.enablePreviewFromQuickOpen.

Ctrl + Tab для навигации по всей истории редактора

Вы можете изменить привязки клавиш для Ctrl + Tab, чтобы показать список всех открытых редакторов из истории, не зависящих от активной группы редакторов.

 

Отредактируйте свои сочетания клавиш и добавьте следующее:

{ "key": "ctrl+tab", "command": "workbench.action.openPreviousEditorFromHistory" },

{ "key": "ctrl+tab", "command": "workbench.action.quickOpenNavigateNext", "when": "inQuickOpen" },

Закрытие всей группы, а не одного редактора

Если вам понравилось поведение VS Code, закрывающего целую группу при закрытии одного редактора, вы можете настроить следующее в своих горячих клавишах.

 

Mac:

{ "key": "cmd+w", "command": "workbench.action.closeEditorsInGroup" }

Windows/Linux:

{ "key": "ctrl+w", "command": "workbench.action.closeEditorsInGroup" }

Управление окнами

В VS Code есть некоторые опции для контроля того, как окна (экземпляры) должны быть открыты или восстановлены между сеансами.

 

Настройки window.openFoldersInNewWindow и window.openFilesInNewWindow предоставляются для настройки открытия новых окон или повторного использования последнего активного окна для файлов или папок, а возможные значения - default, on и off.

 

Если настроено на default, мы сделаем все возможное, чтобы повторно использовать окно или нет на основе контекста, из которого был сделан открытый запрос. Измените это, чтобы включить или выключить, чтобы всегда работало одинаково. Например, если вы считаете, что выбор файла или папки из меню Файл всегда должен открываться в новом окне, установите его в положение on.

 

Примечание: Могут быть случаи, когда этот параметр игнорируется (например, при использовании опции командной строки -new-window или -reuse-window).

 

Параметр window.restoreWindows сообщает VS Code, как восстановить открытые окна предыдущего сеанса. По умолчанию VS Code снова откроет последнее открытое окно, в котором вы работали (настройка: one). Измените этот параметр на none, чтобы никогда не открывать окна и никогда не начинать с пустого экземпляра VS Code. Измените на all чтобы восстановить все окна, над которыми вы работали во время предыдущего сеанса или на folders, только для восстановления окон, в которых были открыты папки.

Следующие шаги

Теперь, когда вы знаете общую схему VS Code, начните настраивать редактор так, как вам нравится работать, глядя на следующие темы:

 

  • Изменение темы - укажите тему и / или значка файла в соответствии с вашими предпочтениями.

Общие вопросы

В: Как изменить цвет направляющих отступа?

О: Цвета направляющих отступа настраиваются, как и большинство элементов интерфейса VS Code. Чтобы настроить цвет направляющих отступа для активной цветной темы, используйте параметр workbench.colorCustomizations и измените значение editorIndentGuide.background.

 

Например, чтобы сделать направляющие отступа яркими, добавьте следующие настройки в ваш settings.json:

"workbench.colorCustomizations": {

    "editorIndentGuide.background": "#0000ff"

}