Как настроить Visual Studio Code для C, C++, Java, Python
Visual Studio Code — популярный редактор кода, бесплатный и с открытым исходным кодом. Но я уверен: каждый из нас, кто пытался настроить Visual Studio Code для разработки приложений на C++, Java или Python, прошел через стадию: “О Боже! Почему нельзя как-нибудь попроще?” Я сам пробовал настроить VS Code пару раз и в итоге закончил тем, что использовал CodeBlocks. 🙁
Прочитав много документации, посмотрев ряд роликов на YouTube и потратив несколько дней на саму настройку VS Code, я пишу эту статью, чтобы все это не пришлось проделывать уже вам!
Сегодня я покажу, как настроить среду разработки для спортивного программирования на C++, Java и Python в VS Code с нуля. Мы также посмотрим, какие расширения больше всего пригодятся, чтобы начать работу с VS Code. В конечном счете, ваша среда разработки будет выглядеть примерно так:
1. Устанавливаем Visual Studio Code
Скачайте последнюю версию Visual Studio Code с официального сайта. Рекомендуется загрузить системный установщик (System Installer), но если у вас нет прав администратора, то пользовательский установщик (User Installer) тоже подойдет. Выполните все обычные шаги по установке и обязательно проставьте все следующие чекбоксы:
Если у вас уже установлен VS Code, но вы все равно хотите начать с чистого листа, следуйте этим инструкциям, чтобы полностью удалить VS Code.
2. Настраиваем расширения
Ниже приведен список расширений, которые нам понадобятся для правильной настройки VS Code. Откройте VS Code и перейдите на панель расширений (Ctrl + Shift + X), которая находится на левой панели инструментов, и начните загружать друг за другом следующие расширения:
- C / C++ от Microsoft — [Важно] Для корректной работы этого расширения нам понадобится установленный и добавленный в PATH компилятор MinGW. Если у вас его нет, следуйте этому руководству.
- C++ Intellisense от austin.
- Python от Microsoft — вам нужно будет настроить Python для работы этого расширения. Загрузите и установите последнюю версию отсюда.
- Java Extension Pack от Microsoft — [Важно] Перед установкой убедитесь, что в вашей системе настроены Java 8 JDK и JRE и указаны все необходимые переменные среды для Java. Если нет, посмотрите это видео о том, как настроить Java на вашем компьютере.
- Code Runner от Jun Han — мы будем использовать это расширение для запуска всех наших программ. Для этого необходимо выполнить некоторые шаги по настройке. Мы увидим эти шаги в следующих разделах.
Расширения, перечисленные ниже, необязательны для дальнейшей настройки, но я рекомендую вам обратить на них внимание, посмотреть, заинтересуют ли они вас, и если нет, то перейти к следующему разделу.
- (Необязательно) Material Theme от Mattia Astronio — это расширение содержит множество приятных глазу тем. Вы можете выбрать любую, какая понравится. Лично я предпочитаю Monokai, которая доступна в VS Code по умолчанию, без каких-либо расширений.
Чтобы выбрать тему, нажмите Ctrl + Shift + P. Откроется палитра команд. Осуществите поиск по слову “theme” и выберите опцию Color Theme. Чтобы настроить иконки, можете выбрать опцию File Icon Theme.
Расширения для тех, кто интересуется FrontEnd-фреймворками для веб-разработки, такими как Angular и React:
- (Необязательно) Angular Language Service от Angular.
- (Необязательно) Angular Snippets от John Papa.
- (Необязательно) ES7 React / Redux / GraphQL / React-Native snippets от dsznajder.
- (Необязательно) React Native Tools от Microsoft.
- (Необязательно) Live Server от Ritwick Dey.
3. Настраиваем внешний вид редактора
Итак, мы уже установили VS Code и несколько расширений. Теперь мы готовы настраивать среду разработки. Я создал шаблон для спортивного программирования в VS Code и загрузил его в свой профиль на Github.
Перейдите по этой ссылке и загрузите шаблон себе на компьютер. Распакуйте его в любое место по вашему выбору. После этого откройте получившуюся папку в VS Code. Вы должны увидеть что-то вроде этого:
Пройдитесь по файлам main.cpp, Main.java и main.py и посмотрите на записанный в них образец кода. По сути, шаблонный код, предоставленный в образцах для каждого из этих трех языков, принимает входящие данные из файла input.txt и обеспечивает вывод в файл output.txt. Для каждой программистской задачи, которую вы хотите решить, просто создайте копию этого шаблона и напишите свой код в функции solve().
Теперь создадим ту разбивку экрана, которую вы могли видеть на самом первом изображении в этой статье. Эта разбивка позволяет сразу видеть как ввод, так и вывод вашего кода, что делает ее очень удобной в использовании.
- Откройте файлы в следующем порядке: main.cpp, input.txt, output.txt. Порядок, в каком были открыты файлы, можно видеть сверху на панели инструментов. Убедитесь, что порядок именно такой, как указано выше.
- Откройте input.txt. Выберите в меню View -> Editor Layout -> Split Right. Вы должны увидеть что-то подобное:
- У вас получится две группы. Перетащите output.txt из левой группы в правую. Закройте тот input.txt, что остался слева. Должно выйти примерно так:
Как настроить Visual Studio Code на работу с С++?
как настроить Visual Studio Code на работу с С++ после установки нужных плагинов? Visual Studio не подходит, ест много ресурсов, да и функционал немного другой.
Отслеживать
задан 31 авг 2020 в 19:41
usernameusername usernameusername
23 1 1 золотой знак 1 1 серебряный знак 3 3 бронзовых знака
Документацию читали?
31 авг 2020 в 19:47
Компилятор установлен? VSCode просто навороченный блокнот.
31 авг 2020 в 19:48
Visual Studio ест меньше ресурсов, VS Code — это же браузерное решение.
31 авг 2020 в 20:11
нужно мало ресурсов — vim/emacs наше все:)
31 авг 2020 в 20:14
«после установки нужных плагинов» Вопрос интересно поставлен. Половина настройки как раз в выборе хороших плагинов. Что вы уже поставили?
31 авг 2020 в 20:27
1 ответ 1
Сортировка: Сброс на вариант по умолчанию
примерно год назад я точно так же не мог с первого раза настроить VS Code.
Как справедливо указали в комментариях — есть прекрасная официальная документация по настройке. Тем не менее, я оставлю свой ответ, так как он более детальный в некоторых моментах. А в других моментах — менее детальный 🙂
Чтобы настроить VSC, хорошо бы научиться компилировать и запускать Вашу программу из командной строки. А потом настройки, котрые для этого понадобились, добавить в правильные места в файлах конфигурации VS code.
Труднность этого процесса именно в «зоопарке» разных возможностей. На этого не стоит пугаться.
Кроме того, настройка немного отличатся для разных систем (Linux, windows, macos), а Вы не указали, какая система у вас.
Я приведу пример настройки для компилятора gcc под Win64. Можно повторить мои шаги, а когда получится — сделать самостотельную настройку, например, на другой компилятор.
- Устанавливаем msys2. Я установил его в C:\Programs\msys64 . При этом сам msys2 позаботился о том, чтобы путь к его директории C:\Programs\msys64\mingw64\bin оказался в path. Проверить это можно, выполнив в консоли команду path
- Устанавливаем компилятор и дебаггер. Я делаю это с помощью пакета msys2, выполнив в окне, котрое открывает msys2, следующие команды:
pacman -Syuu
Эта команда обновляет msys2. Она может закрыть консоль — это нормально, нужно перезапустить ее и ввести ту же команду, чтобы завершить обновление. Хорошей идеей будет время от времени обновляться, чтобы всегда иметь последнюю версию компилятора. Затем:
pacman -S mingw-w64-x86_64-gcc pacman -S mingw-w64-x86_64-gdb
Теперь в Вашей системе есть компилятор и дебаггер. Проверить это просто: открываем новое окно консоли, пишем g++ —version
Если ответом не является версия — надо поискать, что пошло не так. Проверить path, возможно, отредактировать его вручную.
Такую же проверку хорошо бы сделат для дебаггера: gdb —version
-
Пишем hello world. Это позволит нам окончательно убедиться, что компилятор работает. в любой директории созадем файл hello.cpp с текстом
#include int main() < std::cout ;
потом в этой папке в командной строке компилируем командой g++ hello.cpp -o hello.exe Если появился файл hello.exe, и он запускается и вывоит строчку - ок, этот шаг завершен.
- А вот теперь можно поставить VSC. Обратите внимание, что редакций есть несколько, во первых для 32 и 64 битных систем, а во вторых - то, что назывется "User Installer" и "System Installer". Выбираем 64 битный System Installer на странице загрузки
- В VSC ставим расширение для работы с C++, оно называется C/C++ for Visual Studio Code и написано Microsoft
- Теперь запустим VSC в папке Вашего проекта. Пусть это будет папка C:\Projects\ . Делается это так: запускам консоль. Переходим в консоли в папку ( cd C:\Projects\ ). Запускаем VSC командой code . .
Важно то, что при этом создаётся папка настроек VSC, котрые находятся по пути C:\Projects\.vscode . В этой папке нужно создать 4 файла, я приведу их в минимальном варианте. Пути - для моей системы, где msys2 установлен в C:\Programs\msys64\ .
Файл tasks.json - отвечает за то, чтобы работала комбинация клавиш Ctrl+shift+B для сборки программы:
< "version": "2.0.0", "tasks": [ < "type": "shell", "label": "g++.exe build active file", "command": "C:/Programs/msys64/mingw64/bin/g++.exe", "args": [ "-std=c++17", "-g", "$", "-o", "$\\$.exe" ], "options": < "cwd": "C:\\Programs\\msys64\\mingw64\\bin" >, "problemMatcher": [ "$gcc" ], "group": < "kind": "build", "isDefault": true >> ] >
Файл launch.json - отвечает за работу дебаггера:
< "version": "0.2.0", "configurations": [ < "name": "g++.exe build and debug active file", "type": "cppdbg", "request": "launch", "program": "$\\$.exe", "args": [], "stopAtEntry": false, "cwd": "$", "environment": [], "externalConsole": false, "MIMode": "gdb", "miDebuggerPath": "C:\\Programs\\msys64\\mingw64\\bin\\gdb.exe", "setupCommands": [ < "description": "Enable pretty-printing for gdb", "text": "-enable-pretty-printing", "ignoreFailures": true >], "preLaunchTask": "g++.exe build active file", "internalConsoleOptions": "neverOpen" > ] >
Файл settings.json - как то отвечает за файловые ассоциации, возможно даже, что он не особо нужен. Но лишним не будет:
Файл c_cpp_properties.json - отвечает за расположение include - файлов:
< "configurations": [ < "name": "Win32", "includePath": [ "$/**", "C:/Programs/msys64/mingw64/include/**" ], "defines": [ "_DEBUG", "UNICODE", "_UNICODE" ], "windowsSdkVersion": "8.1", "compilerPath": "C:\\Programs\\msys64\\mingw64\\bin\\g++.exe", "cStandard": "c11", "cppStandard": "c++17", "intelliSenseMode": "gcc-x86" > ], "version": 4 >
Если Вы создадите эти файлы, а потом заново запустите в этой директории VSC - то всё уже должно работать. То есть, программы на C++ будут компилироваться, запускаться в отладке (по F5) и показывать значения переменных в окне отладчика.
Теперь - самое важное. Как только заработает - Вам нужно эту папку .vscode копировать к корень каждой папки с проектом на C++. Это позволит VSC запускаться с Вашими настройками.
Даже если мой способ Вам не подходит напрямую - у Вас теперь есть все необходимые ключевые слова, чтобы использовать их для гуглежа.
PS. Время от времени попадаются полезные дополнительные возможности для настройки.
Вот такой фрагмент файла tasks.json позволяет очищать окно терминала перед каждым билдом - полезно, чтобы уже не видеть уже исправленных ошибок, оставшихся от предыдущей попытки сборки (Источник):
"presentation": < "clear": true //
Настройки системы IntelliSense в Visual Studio
Система Visual Studio устанавливает много настроек средств IntelliSense по умолчанию, но многие из них можно изменить с помощью диалогового окна Options, если их значения, заданные по умолчанию, не устраивают разработчика. Некоторые из этих настроек связаны только с определенным языком программирования.
Общие настройки
Сначала рассмотрим настройки из группы Keyboard в разделе Environment. Каждой команде, доступной в системе Visual Studio, соответствует вполне определенная запись в списке комбинаций клавиш (на рисунке ниже показано диалоговое окно Options, которое открывается по команде Tools --> Options):
Комбинации клавиш, заданные по умолчанию, можно заменить или добавить новые. Комбинации клавиш для команд системы IntelliSense приведены в таблице ниже:
Выводит на экран информацию команды Quick Info о выбранном элементе
Пытается дополнить слово, если существует однозначное соответствие, или выводит список, если есть несколько совпадений
Переключает систему IntelliSense из режима подсказки в режим дополнения
Выводит на экран информацию о списке параметров вызываемой функции
Открывает диалоговое окно Code Snippet, в котором можно выбрать фрагмент кода, чтобы вставить его автоматически (создание и использование сниппетов мы рассмотрим позже)
Генерирует полную заглушку метода по шаблону
Генерирует определения абстрактного класса из заглушки
Генерирует явную реализацию интерфейса для определения класса
Генерирует неявную реализацию интерфейса для определения класса
Используя способы, описанные в статье "Горячие клавиши в Visual Studio", можно добавить новые комбинации клавиш или изменить существующие для любой команды.
Дополнение инструкции
Работой системы IntelliSense можно управлять либо в глобальном масштабе, как показано на рисунке ниже, либо для каждого языка программирования в отдельности. Для того чтобы определить способ вывода списка членов классов или вообще отменить его вывод, на закладке General в группе All Languages диалогового окна Options можно изменить настройки Statement Completion:
Настройки для языка C#
Кроме общих настроек интегрированной среды разработки и языков программирования для системы IntelliSense, некоторые языки, например C#, имеют дополнительную закладку для определения собственных настроек. С помощью закладки настроек для языка C#, показанной на рисунке ниже, можно также задать способ вызова и использования средств технологии IntelliSense.
Во-первых, можно отключить список дополнений, чтобы они не появлялись автоматически. Некоторые разработчики предпочитают делать именно так, потому что списки членов классов мешают им набирать тексты своих программ. Если список дополнений выводится не автоматически, а только по вызову, то пользователь может сам решить, что включать в эти списки, помимо стандартных записей, включая ключевые слова и фрагменты кода.
Для того чтобы выбрать запись в списке членов классов, можно использовать любой из символов, доступных в разделе Selection In Completion List, или нажать клавишу пробела. В заключение, как указывалось ранее, система Visual Studio автоматически выделит тот член класса в списке, который использовался последним. В языке C# можно либо отключить это свойство, либо очистить историю.
Дополнительные возможности системы IntelliSense
Кроме основных аспектов технологии IntelliSense, в системе Visual Studio 2013 реализованы также дополнительные функциональные возможности интегрированной среды разработки, которые тоже относятся к этой технологии. Эти свойства подробно обсуждаются позже, а в этой статье приводится лишь их краткое описание.
Сниппеты
Сниппеты (code snippets) - это фрагменты кода, которые можно автоматически генерировать и вставлять в свой собственный код вместе с соответствующими ссылками и директивами using, помечая переменные фразы, чтобы облегчить их замену. Для того чтобы открыть диалоговое окно Code Snippets, следует нажать клавиши , .
В поисках требуемого сниппета можно перемещаться по иерархии каталогов сниппетов. Если разработчик знает комбинацию клавиш, установленную для конкретного сниппета, он может просто нажать ее и клавишу , и система Visual Studio вставит сниппет, не открывая диалоговое окно. Мощь сниппетов будет продемонстрирована в одной из следующих статей.
Комментарии XML
Комментарии XML используются как способ автоматического документирования проектов и решений. Еще одним преимуществом использования XML-комментариев в своем коде является то, что система Visual Studio может использовать их в своей системе IntelliSense для вывода подсказок и более полной информации о параметрах, помимо простой информации о типах, как это делается в обычных пользовательских классах. Мы приведем примеры использования комментариев XML в одной из следующих статей.
Добавление собственных схем IntelliSense
Пользователь может добавить собственные схемы IntelliSense, которые бывают полезными для редактирования XML- и HTML-файлов. Для этого следует создать правильно отформатированный XML-файл и инсталлировать его в подкаталог Common7\Packages\schemas\xml каталога инсталляции системы Visual Studio (по умолчанию C:\Program Files\Microsoft Visual Studio ). Например, можно расширить возможности технологии IntelliSense для XML-редактора, включив свою собственную схему определений. Описание процесса создания таких схем, выходит за рамки нашего руководства, но о нем можно прочитать в статье "Функции IntelliSense редактора XML".
Итак, в этой и предыдущих статьях мы рассмотрели систему IntelliSense. Функциональные возможности технологии IntelliSense выходят за пределы основного окна редактирования кода. Мощь технологии IntelliSense, проявляющаяся в автоматическом дополнении инструкций и параметров, можно использовать во многих других инструментальных окнах, например Command и Immediate. Любые ключевые слова и даже переменные и объекты, известные в текущем контексте на протяжении сессии отладки, могут быть найдены с помощью списка членов классов IntelliSense. Технология IntelliSense во всех ее проявлениях значительно повышает эффективность работы системы Visual Studio по сравнению с большинством других доступных инструментов. Постоянно отслеживания нажатия клавиш, чтобы обеспечить обратную визуальную связь или автоматическое дополнение и генерацию кода, система IntelliSense позволяет разработчикам исключительно быстро, эффективно и правильно набирать программы с первой попытки.
Настройка VS Code для верстки
Сегодня мы рассмотрим установку и настройку Visual Studio Code для верстки. В результате мы получим удобную, лаконичную рабочую среду с необходимыми плагинами, которые я использую в своей работе. VS Code в настоящее время является самым популярным редактором кода благодаря широкому функционалу, кроссплатформенности, огромному сообществу разработчиков как самого редактора, так и расширений для него и открытой лицензии. Этот редактор я могу смело рекомендовать к использованию.
Поделиться Отправить Класснуть Запинить
Материалы урока и полезное
- Visual Studio Code: Страница редактора
- Simple Starter: Ознакомиться и скачать
- Урок по GitHub Gist: Ознакомиться с уроком
- Архив с настройками: Скачать
- Верстка с Emmet: Смотреть урок
Рекомендуемые расширения
- CSS Peek
- eCSStractor for VSCode
- Gist
- Sass
- HTML to CSS autocompletion
- IntelliSense for CSS class names in HTML
- Live Server
- One Dark Pro
Пресет настроек settings.json
< "emmet.extensionsPath": [ "~/AppData/Roaming/Code/User/emmet" ], // "php.validate.executablePath": "D:/OSPanel/modules/php/PHP_8.1/php.exe", // "terminal.integrated.defaultProfile.windows": "Git Bash", // "terminal.integrated.defaultProfile.windows": "Ubuntu (WSL)", "workbench.startupEditor": "none", "editor.smoothScrolling": true, "editor.fontSize": 16, "editor.minimap.enabled": false, "breadcrumbs.enabled": false, "editor.renderControlCharacters": true, "editor.tabSize": 2, "workbench.activityBar.visible": false, "files.defaultLanguage": "html", "git.ignoreMissingGitWarning": true, "editor.detectIndentation": false, "editor.folding": false, "editor.glyphMargin": false, "editor.parameterHints.enabled": false, "editor.hover.enabled": false, "terminal.integrated.fontSize": 16, "editor.renderWhitespace": "boundary", "editor.lineHeight": 23, "liveServer.settings.donotShowInfoMsg": true, "liveServer.settings.donotVerifyTags": true, "security.workspace.trust.enabled": false, "editor.linkedEditing": true, "editor.bracketPairColorization.enabled": true, "editor.wordSeparators": "`~!@#$%^&*()=+[\\|;:'\",.<>/?", "emmet.triggerExpansionOnTab": true, "editor.insertSpaces": false, "git.openRepositoryInParentFolders": "never", "editor.cursorSmoothCaretAnimation": "on", "explorer.confirmDelete": false, "workbench.colorTheme": "One Dark Pro Darker", "ecsstractor_port.add_comment": false, "ecsstractor_port.empty_line_before_nested_selector": false >