Visual Studio Code

Visual Studio Code #

Что такое Visual Studio Code? #

Visual Studio Code — это текстовый редактор, вроде блокнота в Windows, но созданный специально для программистов: он поставляется вместе с подсветкой синтаксиса, автодополнением, встроенным терминалом, системой контроля версий и ещё огромным количеством инструментов, упрощающих написание кода. Однако VS Code это не IDE, т.е. он изначально не содержит в себе инструментов для компиляции и запуска написанного кода, что означает, что для комфортной разработки, его необходимо настроить соответствующим образом. Именно этому и посвящена данная статья.

Где скачать #

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

Настройка для работы с C++ #

Windows #

  1. Установить компилятор g++ отсюда, выбрав последнюю доступную версию нужной разрядности. После установки необходимо перезапустить компьютер;
  2. Открываем командную строку, для этого нажимаем комбинацию клавиш Win + R, вводим cmd и нажимаем Enter, в открывшемся окне прописываем g++ --version и снова нажимаем Enter. Если ты увидишь сообщение, содержащее версию, значит компилятор установлен и можно переходить к следующему шагу. Если же появится ошибка, значит система не понимает, где установлен компилятор, и ей необходимо указать, где он находится. Для этого необходимо добавить g++ в PATH: Параметры > Система > О системе > Сведения о системе > Дополнительные параметры системы > Переменные среды > Системные переменные > Path, тут необходимо нажать кнопку Добавить и вставить следующий путь: c:\mingw\libexec\gcc\x86_64-w64-mingw32;
  3. Теперь ты можешь компилировать С++ код, прописывая в консоли g++ FILE_NAME.cpp, и запускать скомпилированный файл a.exe. Однако можно автоматизировать этот процесс внутри VS Code. Для этого нужно зайти в раздел с расширениями с помощью комбинации клавиш Ctrl + Shift + X или можно нажать на иконку с кубиками в боковой панели, а затем найти и установить расширение Code Runner;
  4. Теперь, чтобы скомпилировать .cpp файл, можно просто использовать комбинацию клавиш Ctrl + Alt + N или соответствующую кнопку в правом верхнем углу. При желании, её можно изменить в настройках;
  5. Далее необходимо открыть настройки, пользуясь сочетанием клавиш Ctrl + , или нажав на шестерёнку в левом нижнем углу. В строке поиска ввести @ext:formulahendry.code-runner terminal и поставить галочку в Code-runner: Run In Terminal. Теперь код будет запускаться во встроенном терминале, и у тебя появится возможность вводить входные данные с клавиатуры.

Linux #

  1. Установить компилятор g++ используя пакетный менеджер, например, если ты используешь Ubuntu, тебе нужно открыть терминал и написать sudo apt install gcc;
  2. Чтобы убедиться, что компилятор установился правильно, введи в терминале g++ --version. Если всё в порядке, ты увидишь сообщение, содержащее версию g++;
  3. Далее, уже в самом VS Code, заходим в раздел с расширениями с помощью Ctrl + Shift + X или можно просто нажать на иконку с кубиками в боковой панели, а затем найти и установить расширение Code Runner;
  4. Теперь, чтобы скомпилировать .cpp файл, ты можешь просто использовать комбинацию клавиш Ctrl + Alt + N. При желании, её можно изменить в настройках;
  5. Далее необходимо открыть настройки, пользуясь сочетанием клавиш Ctrl + , или нажав на шестерёнку в левом нижнем углу. В строке поиска ввести @ext:formulahendry.code-runner terminal и поставить галочку в Code-runner: Run In Terminal. Теперь код будет запускаться во встроенном терминале, и у тебя появится возможность вводить входные данные с клавиатуры.

Mac #

  1. На Mac установить компилятор g++ легче всего, используя пакетный менеджер Homebrew, который не установлен по умолчанию. Чтобы его установить, тебе нужно открыть терминал и вставить туда следующую команду:

    /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

  2. Теперь, чтобы установить компилятор, нужно просто написать в терминале brew install gcc. После этого ты можешь проверить, что компилятор действительно установился, для этого введите в терминале g++ --version. Если g++ установлен, ты увидишь сообщение, содержащее его версию;

  3. Далее, уже в самом VS Code, заходим в раздел с расширениями с помощью Cmd + Shift + X или можно просто нажать на иконку с кубиками в боковой панели, а затем найти и установить расширение Code Runner;

  4. Теперь, чтобы скомпилировать .cpp файл, можно просто использовать комбинацию клавиш Cmd + Alt + N. При желании, её можно изменить в настройках;

  5. Далее необходимо открыть настройки, пользуясь сочетанием клавиш Cmd + , или нажав на шестерёнку в левом нижнем углу. В строке поиска ввести @ext:formulahendry.code-runner terminal и поставить галочку в Code-runner: Run In Terminal. Теперь код будет запускаться во встроенном терминале, и у тебя появится возможность вводить входные данные с клавиатуры.

Несколько советов для удобства #

  1. Если ты раньше пользовался Visual Studio, и, открывая свой старый код, у тебя возникают проблемы с отображением кириллицы, тебе следует изменить кодировку файла. Для этого во встроенной командной строке найди Change File Encoding > Reopen with Encoding и выбери самое первое с подписью Guessed from content.
  2. Для того, чтобы программа корректно компилировалась, каждый раз после её изменения нужно сначала её сохранить с помощью Ctrl + S. Чтобы этого не делать, можно включить автосохранение: для этого нужно найти параметр Files: Auto Save в настройках и выбрать значение afterDelay.
  3. Чтобы изменить или добавить сочетания клавиш, открой командную строку (Ctrl + Shift + P на Windows и Linux или Cmd + Shift + P на Mac) и в поиске найди Preferences: Open Keyboard Shortcuts. Например, одной из полезных горячих клавиш будет увеличение/уменьшение размера шрифта, для этого в меню горячих клавиш введи Editor Font Zoom и поставь горячие клавиши на ...In и ...Out, мы предпочитаем использовать Ctrl + = для увеличения и Ctrl + - для уменьшения шрифта.
  4. При компиляции .cpp файла в папке с ним появляется .out файл. Чтобы .out файлы не мешались во встроенном проводнике, можно скрыть их в настройках. Для этого в настройках введи Files: Exclude, и добавь туда значение *.exe (аналогично для любого другого расширения).

Работа с Git #

Visual Studio Code даёт всё необходимое для удобной работы с системой контроля версий. Здесь ты можешь спокойно пуллить, коммитить, пушить, мерджить и т.д. Самый простой, на мой взгляд, способ это делать — использовать командную строку Ctrl + Shift + P. Здесь ты можешь найти любое действие в системе контроля версий. Все они начинаются с Git:, а дальше идёт название действия, например, Git: Pull или Git: View File History.

Другим способом работы с Git является вкладка View: Show Source Control, где можно делать всё то же, но используя графический интерфейс.

VS Code в браузере #

GitHub очень тесно интегрируется с VS Code — ты можешь открыть любой репозиторий и нажать на клавиатуре на точку или поменять github.com на guthub.dev в адресной строке, чтобы открыть web-версию VS Code. Тут ты сможешь посмотреть и изменить файлы, не клонируя репозиторий на свой компьютер. Однако, это неполноценная версия VS Code: здесь у тебя не получится воспользоваться терминалом или скомпилировать .cpp файл.

Кастомизация #

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

Например, я предпочитаю минималистичный вид, поэтому мой VS Code на данный момент выглядит вот так:

My VS Code screenshot

Темы #

Одним из самых простых и очевидных способов изменения внешнего вида редактора является установка тем. Всё, что нужно для этого сделать это:

  1. Открыть панель расширений c помощью Ctrl + Shift + X на Windows и Linux или Cmd + Shift + X на Mac;
  2. Найти понравившуюся тему (@category:"themes" чтобы видеть только темы);
  3. Нажать на кнопку Install;
  4. Если тема не применилась автоматически, или ты хочешь выбрать другую среди установленных, достаточно открыть командную строку (Ctrl + Shift + P на Windows и Linux или Cmd + Shift + P на Mac), после чего найти параметр Preferences: Color Theme и выбрать желаемую тему.

Мои любимые темы: Auy , GitHub , Horizon и Xcode 12 .

Иконки файлов #

Точно так же, как и темы, ты можешь изменить иконки во встроенном проводнике — боковой панели, которая отображает все файлы рабочей директории. Для этого достаточно просто написать icons в поиске расширений и установить расширение с понравившимися иконками. Если иконки не применились автоматически, или ты хочешь выбрать другую среди установленных, достаточно открыть командную строку и в параметре Preferences: File Icon Theme выбрать желаемую тему иконок.

Мои любимые наборы иконок: Seti , Mac icons и Material Theme icons .

Шрифт #

В VS Code ты можешь поменять шрифт кода с помощью параметра Editor: Font Family в настройках, где перечисляются шрифты по приоритету. Например, у меня это 'Fira code', Menlo, Monaco, 'Courier New', monospace, что означает, что будет использоваться шрифт Fira Code, но если он не найдётся среди установленных, будет использоваться Menlo и так далее. Чтобы использовать свой шрифт, просто добавь его первым в эту строку.

Мои любимые шрифты: Fira Code и JetBrains Mono .

Оба этих шрифта поддерживают лигатуры. Что это? Лигатура — это знак, объединяющий два или более символа. В коде они применяются для отображения операторов и помогают уменьшить шум путем слияния символов и удаления лишних деталей и в определённых случаях уравновесить пространство между символами. Вот несколько примеров:

Ligatures example

Скрытие панелей #

Ещё одним способом кастомизации VS Code является изменение поведения панелей и других элементов интерфейса, что помогает освободить огромное количество места на экране. У меня обычно скрыты все элементы интерфейса, кроме самого пространства редактора, а когда у меня появляется необходимость воспользоваться, скажем, строкой состояния, я использую соответствующую комбинацию клавиш. Все сочетания клавиш настраиваются в Preferences: Open Keyboard Shortcuts.

Настройки #

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

И ешё, все свои настройки ты можешь синхронизировать через свой аккаунт GitHub, чтобы иметь единые настройки на компьютере дома и в университете. Статья об этом .

Автор: Михаил Чернигин