Vs code install

Vs code install

Скачиваемые файлы

Visual Studio 2022

Community

Professional

Enterprise

Предварительный просмотр

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

Visual Studio 2022 для Mac

Дополнительные сведения о активация лицензии

Предварительный просмотр

Получите ранний доступ к последним функциям, которые еще не доступны в основном выпуске.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Visual Studio Code

Версия 1.68

Автономный редактор исходного кода, работающий в Windows, macOS и Linux.Лучший выбор для Java и веб-разработчиков с множеством расширений, поддерживающих любые языки программирования.

Используя Visual Studio Code, вы соглашаетесь с его license & заявлением о конфиденциальности.

Все еще не знаете, какой инструмент лучше всего вам подходит?Мы можем помочь

Visual Studio для Windows

Полный массив функций и средств разработки в едином центре для расширения и улучшения каждого этапа разработки программного обеспечения.
Установка в автономном режимеСравнить выпуски

Встроенные функции Visual Studio совершенствуют полный цикл разработки.

Visual Studio для Mac

Полный массив функций и средств разработки в собственном интерфейсе macOS для каждого этапа разработки программного обеспечения.

Installing and customizing Visual Studio Code: VS Code setup from scratch

Visual Studio Code (VS Code) is a source code editor or IDE (Integrated Development Environment) freely available for all major operating systems. Although VSCode has native features to help you develop applications and websites in several languages, what makes VS Code an excellent choice for developers is the vast ecosystem of extensions that allow you to customize and fine tune your VS Code installation to meet your specific needs.

In this article, you’ll learn how to install and customize VS Code to make it the right fit for your coding needs. You’ll also get a list of recommended extensions for improving your overall productivity, no matter your programming language of choice. As an appendix, I’ve included a few extensions that I personally use for PHP Development.

Installing Visual Studio Code

As mentioned earlier, VS Code is available for all major operating systems. To get started, access their download page and download the adequate installer for your system.

Installing on Ubuntu

Exit fullscreen mode

Installing on other systems

For other systems, download and execute the appropriate installer.

Getting familiar with the interface

After installation is complete, open VS Code. You’ll see a «Get Started» page like this:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

In this page you have some shortcuts to change your configuration, set up synchronization, and install language-specific extensions. You don’t need to do this now; first, let’s explore how to navigate the IDE interface.

Opening a project in VS Code

To open an existing project, use the files icon on the left menu (it’s the first icon). Then, choose a project directory to open, or clone a remote repository to get started.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Changing the font size

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Increase the IDE fonts / window zoom level

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Changing the editor theme

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install
_ The theme chosen in this gif is «Monokai Dark»._

Using the source control tool

The third icon on the left menu will give you access to VS Code’s built-in source control tool, a helper tool that allows you to discard and commit changes to source control without the need to run commands from a terminal.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

How to install extensions

Once you’re satisfied with your basic setup, you may want to start exploring VS Code extensions. The VS Code Marketplace offers a large collection of useful extensions to customize your VS Code so that it attends all your coding needs.

There are two different ways to install an extension from the marketplace:

Installing directly through the IDE

You can search and install extensions directly from the VS Code interface by accessing the extensions tab, the 5th button on the top left menu.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Installing with a command

If you are navigating the marketplace looking for extensions and find one you want to install, you can do so with a command executed through VS Code’s «quick open» shortcut ( CTRL+P ). The extension page typically has instructions on how to do so. For instance, let’s say you want to install the Markdown all in one extension, a popular markdown extension for VS Code. From VS Code, type CTRL+P and paste in the following command:

Exit fullscreen mode

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Each extension has a unique name that you can find on the extension’s marketplace page. You’ll need that name to install the extension with the ext install command.

Recommended productivity extensions

In this section, you’ll find a collection of recommended extensions that can be useful to improve your coding productivity regardless of your programming language of choice.

Sourcegraph code search

The newly released Sourcegraph VS Code extension allows you to search code across millions of open source repositories right from your IDE. You don’t need an account to use the plugin, but connecting to a free account enables you more features such as searching across your private repositories on multiple code host services.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Installation

Exit fullscreen mode

In the following video, I show a brief overview of how to use the Sourcegraph plugin on VS Code to search for examples of how a method is used across open source repositories.

For more information and tips on how to use Sourcegraph’s VS Code extension, check this blog post.

Prettier

Prettier is a popular code formatting tool that is also available as a VS Code extension. It enforces a consistent code style based on a set of rules that take into consideration the maximum line length, wrapping and reformatting code when necessary.

Installation

Exit fullscreen mode

Docker

Installation

Exit fullscreen mode

Color Highlight

Especially useful for developers who work with front end, the Color Highlight extension adds a colored border around colors, which is very handy to give you an instant reference for web colors without having to reload a page on your browser.

Installation

Exit fullscreen mode

Project Manager

The Project Manager extension enables advanced project management on VS Code. It allows you to organize your projects into virtual workspaces with support to tags and remote development.

Installation

Exit fullscreen mode

Markdown all in one

With over 3 million downloads, the Markdown all in one extension is a must-have for anyone who writes documentation in the markdown language.

Installation

Exit fullscreen mode

Spell Right

With the Spell Right extension you’ll have a lightweight and offline spellcheck right into your VS Code installation. It supports several languages and file types.

Installation

Exit fullscreen mode

CodeSnap

The CodeSnap extension allows you to take beautiful screenshots of your code.

Installation

Exit fullscreen mode

Emmet Live

The Emmet Live extensions enables support to emmet abbreviations, special expressions that are evaluated and turned into structured code snippets, such as HTML code.

Installation

Exit fullscreen mode

TailwindCSS Intelesense

The TailwindCSS Intelesense extension adds syntax highlight and autocomplete for TailwindCSS projects on VS Code.

Installation

Exit fullscreen mode

Appendix: PHP extensions

In this section, you’ll find a collection of extensions that are useful for PHP development.

PHP Intelephense

The PHP Intelephense extension enables advanced code analysis and gives you context about methods, variables, classes and other components in a PHP application.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Installation

Exit fullscreen mode

PHP Getters and Setters

The PHP getters and setters extension enables you to quickly generate getter and setter methods on a PHP class, based on its properties.

Installation

Exit fullscreen mode

PHP Namespace Resolver

The PHP namespace resolver extension facilitates importing classes and also allows you to easily order your use statements by line length or in alphabetical order.

Installation

Exit fullscreen mode

Laravel Artisan

The Laravel Artisan extension allows you to run Artisan commands from within your VS Code.

Installation

Exit fullscreen mode

Conclusion

In this post, we saw how to install and customize VS Code for a better coding experience suited to your individual needs. We also saw some useful extensions for productivity, and a few PHP extensions that can help you improve your development speed in that language.

Give these extensions a try, and if some don’t turn out to be useful you can quickly deactivate them through the Extensions tab (the fifth icon on the top left menu).

Have feedback or questions about the Sourcegraph VS Code extension? Leave a comment, or join our Community Slack Space where our team will be happy to answer any questions you may have.

Installing Visual Studio Code¶

If you are a student using a school-issued device, then the software you need is probably already on your machine. Check with your teacher before installing anything!

To start coding on your computer, you need the right tools! Programmers use integrated development environments (IDE) to write and run their code.

Visual Studio Code is a code editor created by Microsoft. We will use it for the later part of the course.

VS Code is very customizable. Once you have everything set up, you can take additional steps to personalize your workspace, such as changing the color theme.

Follow the instructions below to install VS Code on your device.

Windows Users¶

After the installer fully downloads, run it. On the Select Additional Tasks screen, be sure to select both Create a desktop icon and Add to PATH.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

The Select Additional Tasks panel. ¶

Once the installation finishes, you need to open the application and perform a few more steps.

Configure VS Code to Use Git Bash¶

You need to tell VS Code to use Git Bash instead of other Windows terminal programs like PowerShell:

Open the Terminal menu from the top of the app and select New Terminal.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Open the terminal panel. ¶

A new pane opens at the bottom of the application window. This is a terminal window. From the small dropdown found in this pane, choose Select Default Profile.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Find the dropdown menu in the toolbar of the terminal panel. ¶

This will open a tool called the Command Palette at the top-center of the application window. Type Git Bash into the Command Palette and hit Enter.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Type Git Bash in the command palette. ¶

Close VS Code and reopen it. Open a Terminal panel again from the menu. Verify that you see bash in the dropdown menu in the terminal pane. Now every time you open the terminal, it will default to Git Bash!

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

To finish setting up VS Code, complete the steps in the Adding Extensions section below.

Mac Users¶

Double-click the downloaded file and follow the installer instructions (the default selections are all fine). If there is an option to set the PATH environment variable, select it.

Find VS Code in the Applications folder and open the program. Once VS Code is running, right-click on its icon in the dock and select Options > Keep in Dock. You will be using VS Code quite a bit, and adding it to the dock keeps it handy.

Open the Terminal menu from the top of the app and select New Terminal.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Open the terminal panel. ¶

Verify that you see bash in the dropdown menu in the terminal pane. If bash does not appear, follow steps 3-5 in the Configure VS Code section above.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

To finish setting up VS Code, complete the steps in the Adding Extensions section below.

Chromebook Users¶

If you use a virtual desktop for your programming course, do NOT install VS Code on your device. Use the login information your teacher gave you to access the application.

These instructions assume that you have already activated the Linux terminal on your device.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

IMPORTANT: Locate the installation package in the Downloads folder. Drag it into the Linux files folder.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Drag and drop the installer into the Linux files folder. ¶

Open the Linux files folder. Double-click on the installation package to run it. Confirm the action, then wait. Accept all of the default options.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Run the installer! ¶

Once done, return to the Chromebook desktop. Expand the applications dock. Find Visual Studio Code inside the Linux apps subfolder. Click on the icon to launch the program.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Once you are in the program, open the Terminal menu from the top of the app and select New Terminal.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Open the terminal panel. ¶

Verify that you see bash in the dropdown menu in the terminal pane. If bash does not appear, follow steps 3-5 in the Configure VS Code section above.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

To finish setting up VS Code, complete the steps in the Adding Extensions section below.

Adding Extensions¶

Now that Visual Studio Code is up and running, you need to install some extensions. These are small programs that support your work by highlighting keywords, flagging syntax errors, providing suggestions, etc. You used these features in the Replit and Trinket online editors. Extensions let you include the same ones in your VS Code workspace.

Open VS Code and select the Extensions icon on the left side of the workspace.

Extensions add helpful tools to VS Code! ¶

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

This extension allows VS Code to recognize and run Python code. ¶

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

This extension allows VS Code to recognize HTML and CSS code. ¶

Optional Extensions¶

Besides writing and running code, IDEs also provide support for coders! This includes things like previewing a web page inside the workspace or providing suggestions for how to complete code statements.

While not necessary, the following extensions help you work:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

This extension provides suggestions for completing code statements. ¶

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

This extension automatically adds closing tags as you write HTML code. ¶

There are LOTS of other extensions available. Feel free to explore the options, or check Google to find recommendations.

Установка Visual Studio

Вас приветствует Visual Studio 2019! В этой версии можно легко выбрать и установить только необходимые компоненты. Поскольку она занимает меньше памяти, она быстро устанавливается и при установке меньше влияет на систему.

Вас приветствует Visual Studio 2022! В этой версии можно легко выбрать и установить только необходимые компоненты.

Этот раздел относится к Visual Studio в Windows. Информацию о Visual Studio для Mac см. в статье Установка Visual Studio для Mac.

Хотите ознакомиться с другими новыми возможностями этой версии? Обратитесь к заметкам о выпуске.

Хотите ознакомиться с другими новыми возможностями этой версии? Обратитесь к заметкам о выпуске.

Готовы к установке? Мы последовательно опишем каждое действие.

Шаг 1. Подготовка компьютера к установке Visual Studio

Перед началом установки Visual Studio:

Проверьте требования к системе. Так вы узнаете, поддерживает ли ваш компьютер Visual Studio 2019.

Примените актуальные обновления Windows. Эти обновления гарантируют, что на компьютере установлены последние обновления для системы безопасности и необходимые системные компоненты для Visual Studio.

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

Освободите место. Удалите ненужные файлы и приложения с системного диска. Например, запустите приложение очистки диска.

Проверьте требования к системе. Так вы узнаете, может ли ваш компьютер поддерживать Visual Studio 2022.

Примените актуальные обновления Windows. Эти обновления гарантируют, что на компьютере установлены последние обновления для системы безопасности и необходимые системные компоненты для Visual Studio.

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

Освободите место. Удалите ненужные файлы и приложения с системного диска. Например, запустите приложение очистки диска.

Сведения об использовании предыдущих версий Visual Studio параллельно с Visual Studio 2019 см. в разделе Целевая платформа и совместимость для Visual Studio 2019.

Visual Studio 2022 можно установить параллельно с предыдущими версиями. Дополнительные сведения см. в разделе Visual Studio 2022: выбор платформы и совместимость и Параллельная установка версий Visual Studio.

Шаг 2. Скачивание Visual Studio

Теперь скачайте файл начального загрузчика Visual Studio.

Для этого нажмите кнопку ниже, выберите нужный выпуск Visual Studio, щелкните Сохранить, а затем Открыть папку.

Для этого нажмите кнопку ниже, выберите нужный выпуск Visual Studio и сохраните его в папке Загрузки.

Шаг 3. Установка установщика Visual Studio

Запустите файл начального загрузчика, чтобы установить Visual Studio Installer. Новый установщик имеет меньший размер и включает все необходимое для установки и настройки Visual Studio.

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

Если появляется оповещение системы контроля учетных записей, нажмите кнопку Да.

Мы попросим вас принять условия лицензии и заявление о конфиденциальности корпорации Майкрософт. Нажмите Продолжить.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Шаг 4. Выбор рабочих нагрузок

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

Найдите нужную рабочую нагрузку в Visual Studio Installer.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Например, выберите рабочую нагрузку «ASP.NET и разработка веб-приложений». В нее входит основной редактор кода по умолчанию, который предоставляет базовую поддержку редактирования кода для более чем 20 языков, возможность открывать и изменять код в любой папке без наличия проекта и интегрированное управление исходным кодом.

Выбрав нужные рабочие нагрузки, нажмите кнопку Установить.

Далее будут отображаться экраны состояния, на которых демонстрируется ход установки Visual Studio.

Выберите нужную рабочую нагрузку в Visual Studio Installer.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Выбрав нужные рабочие нагрузки, нажмите кнопку Установить.

Далее будут отображаться экраны состояния, на которых демонстрируется ход установки Visual Studio.

В любой момент после установки можно установить рабочие нагрузки или компоненты, которые не были установлены изначально. Если среда Visual Studio открыта, выберите пункт Сервис>Получить средства и компоненты. ; откроется Visual Studio Installer. Или откройте Visual Studio Installer из меню «Пуск». Здесь можно выбрать рабочие нагрузки или компоненты, которые нужно установить. Затем выберите Изменить.

Шаг 5. Выбор отдельных компонентов (необязательно)

Если вы не хотите пользоваться функцией рабочих нагрузок для настройки установки Visual Studio или хотите добавить дополнительные компоненты, которые не устанавливает рабочая нагрузка, это можно сделать путем установки или добавления отдельных компонентов на вкладке Отдельные компоненты. Выберите нужные компоненты и следуйте указаниям.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Шаг 6. Установка языковых пакетов (необязательно)

По умолчанию при первом запуске установщик пытается использовать язык операционной системы. Чтобы установить Visual Studio на нужном языке, выберите в Visual Studio Installer вкладку Языковые пакеты и следуйте указаниям.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Изменение языка установщика из командной строки

Шаг 7. Выбор расположения установки (дополнительно)

Вы можете уменьшить место, занимаемое установкой Visual Studio на системном диске. Вы можете переместить кэш загрузки, общие компоненты, пакеты SDK и средства на другие диски и оставить Visual Studio на самом быстром диске.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Вы можете уменьшить место, занимаемое установкой Visual Studio на системном диске. Дополнительные сведения см. в разделе Выбор расположений установки.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Вы можете выбрать другой диск для Visual Studio IDE или кэша загрузки только в том случае, если вы устанавливаете Visual Studio впервые. Если вы уже установили ее и хотите изменить диск, необходимо удалить Visual Studio, а затем переустановить ее.

Если вы уже установили Visual Studio на компьютере, вы не сможете изменить путь к общим компонентам, инструментам и пакетам SDK, этот пункт будет неактивен. Это общее расположение для всех установок Visual Studio.

Шаг 8. Начало разработки

Когда установка Visual Studio завершится, нажмите кнопку Запустить, чтобы приступить к разработке в Visual Studio.

На начальном экране выберите Создать проект.

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

Можно также фильтровать поиск по определенному языку программирования с помощью раскрывающегося списка Язык. Вы также можете выбирать фильтры из списка Платформа и Тип проекта.

Новый проект откроется в Visual Studio, и вы можете приступить к написанию кода!

Когда установка Visual Studio завершится, нажмите кнопку Запустить, чтобы приступить к разработке в Visual Studio.

На начальном экране выберите Создать проект.

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

Можно также фильтровать поиск по определенному языку программирования с помощью раскрывающегося списка Язык. Вы также можете выбирать фильтры из списка Платформа и Тип проекта.

Новый проект откроется в Visual Studio, и вы можете приступить к написанию кода!

Поддержка или устранение неполадок

Иногда возникают проблемы. Если установить Visual Studio не удается, воспользуйтесь пошаговыми указаниями в статье Устранение неполадок при установке и обновлении Visual Studio.

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

Начало работы с Python в Windows для начинающих

Это пошаговое руководство для пользователей, начинающих работу с Python в Windows.

Настройка среды разработки

Для начинающих, которые не знакомы с Python, рекомендуется установить Python из Microsoft Store. При установке из Microsoft Store используется базовый интерпретатор Python3, но в дополнение к автоматическому обновлению также настраиваются параметры пути для текущего пользователя (без необходимости доступа администратора). Это особенно полезно, если вы работаете из среды образовательного учреждения или являетесь частью организации, которая ограничивает разрешения или административный доступ на компьютере.

Если вы используете Python в Windows для разработки веб-приложений, мы рекомендуем настроить среду разработки другим образом. Вместо установки непосредственно в Windows рекомендуется установить и использовать Python через подсистему Windows для Linux. Справочные сведения см. в следующих статьях: Начало работы с Python для разработки веб-приложений в Windows. Если вы заинтересованы в автоматизации общих задач в операционной системе, ознакомьтесь с нашим руководством: Начало работы с Python в Windows для создания сценариев и автоматизации В некоторых сложных сценариях (например, при необходимости модификации или доступа к установленным файлам Python, создания копий двоичных файлов или непосредственного использования библиотек DLL Python) может потребоваться загрузить определенный выпуск Python непосредственно с сайта python.org или установить альтернативное средство, например Anaconda, Jython, PyPy, WinPython, IronPython и т. д. Мы рекомендуем это только в том случае, если вы более продвинутый программист на Python и у вас есть конкретная причина выбрать альтернативную реализацию.

Установка Python

Чтобы установить Python с помощью Microsoft Store, сделайте следующее:

Перейдите в меню Пуск (значок Windows в нижнем левом углу), введите «Microsoft Store» и щелкните ссылку, чтобы открыть магазин.

Когда магазин откроется, выберите Поиск в верхнем правом меню и введите «Python». Выберите, какую версию Python вы хотите использовать, из результатов в разделе «Приложения». Мы рекомендуем использовать самую последнюю версию, если только у вас нет причин для обратного (например, по причине согласования с версией, использованной в уже существующем проекте, над которым вы планируете работать). Определив, какую версию вы хотите установить, выберите Получить.

Установка Visual Studio Code

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

VS Code также содержит встроенный терминал, который позволяет открывать командную строку Python с помощью командной строки Windows, PowerShell или любой другой, создавая простой рабочий процесс между редактором кода и командной строкой.

Чтобы установить VS Code, скачайте VS Code для Windows: https://code.visualstudio.com.

Установив VS Code, необходимо также установить расширение Python. Для установки расширения Python можно выбрать ссылку на VS Code в Marketplace или открыть VS Code и выполнить поиск по фразе Python в меню расширений (Ctrl+Shift+X).

Python — интерпретируемый язык, и для выполнения кода Python необходимо указать VS Code, какой интерпретатор нужно использовать. Мы рекомендуем использовать самую последнюю версию Python, если у вас нет особой причины для обратного. После установки расширения Python выберите интерпретатор Python 3, открыв палитру команд (CTRL+SHIFT+P), и начните вводить команду Python: Select Interpreter (Python: выбор интерпретатора) для поиска, а затем выберите появившуюся команду. Вы также можете использовать параметр Select Python Environment (Выбрать среду Python) в нижней строке состояния, если она доступна (возможно, уже отображается выбранный интерпретатор). Команда предоставляет список доступных интерпретаторов, которые VS Code может найти автоматически, включая виртуальные среды. Если нужный интерпретатор не отображается, перейдите к статье о настройке сред Python.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Чтобы открыть терминал в VS Code, выберите Просмотр>Терминал или используйте клавиши CTRL+` (символ обратного апострофа). Терминалом по умолчанию является PowerShell.

В окне терминала VS Code откройте Python, просто введя команду: python

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Установка Git (необязательно)

Если вы планируете совместно работать над кодом Python с другими пользователями или размещать проект на сайте с открытым исходным кодом (например, GitHub), примите во внимание, что VS Code поддерживает управление версиями с помощью Git. Вкладка системы управления версиями в VS Code отслеживает все изменения и содержит общие команды Git (добавление, фиксация, принудительная отправка, извлечение) прямо в пользовательском интерфейсе. Сначала необходимо установить Git для включения панели управления версиями.

Скачайте и установите Git для Windows с веб-сайта git-scm.

В комплект входит мастер установки, который задает вам ряд вопросов о параметрах установки Git. Рекомендуется использовать все параметры по умолчанию, если у вас нет конкретной причины изменить какой-либо из них.

Если вы никогда не использовали Git, обратитесь к руководствам по GitHub. Они помогут вам приступить к работе.

Учебник по некоторым основам работы с Python (на примере Hello World)

Python, согласно его создателю Гвидо ван Россуму, — это «язык программирования высокого уровня, и его основная философия проектирования — это удобочитаемость кода и синтаксис, позволяющий программистам выразить концепции в нескольких строках кода».

Python — интерпретируемый язык. В отличие от скомпилированных языков, в которых написанный код необходимо перевести в машинный код для выполнения процессором компьютера, код Python передается непосредственно интерпретатору и запускается напрямую. Просто введите код и запустите его. Попробуем сделать это!

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Надеемся, вам понравилось использовать некоторые из встроенных в Python методов модификации строк. Теперь попробуйте создать файл программы Python и запустить его с помощью VS Code.

Учебник по использованию Python с VS Code (на примере Hello World)

Команда VS Code составила отличный учебник по началу работы с Python с пошаговым руководством по созданию программы Hello World с помощью Python, запуску программного файла, настройке и запуску отладчика, а также установке пакетов, таких как matplotlib и numpy, для создания графического изображения в виртуальной среде.

Откройте PowerShell и создайте пустую папку с именем hello, перейдите в эту папку и откройте ее в VS Code:

Продолжайте работу с учебником в документации для VS Code: Сведения о создании файла исходного кода для Hello World на Python.

Создание простой игры с помощью Pygame

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Pygame — это популярный пакет Python для создания игр, который позволяет учащимся изучать программирование увлекательным способом. Pygame отображает графические изображения в новом окне, поэтому метод «только командной строки» WSL не подойдет. Но если вы установили Python с помощью Microsoft Store, как описано в этом учебнике, все получится.

Если все в порядке, откроется окно игры. По завершении игры закройте окно.

Вот как начать написание кода собственной игры:

Откройте PowerShell (или командную строку Windows) и создайте пустую папку с именем bounce. Перейдите к этой папке и создайте файл с именем bounce.py. Откройте папку в VS Code:

С помощью VS Code введите следующий код Python (или скопируйте и вставьте его):

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

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

Дополнительные сведения о создании игр с помощью Pygame см. на сайте pygame.org.

Материалы для непрерывного обучения

Мы рекомендуем использовать следующие ресурсы, чтобы продолжить изучение разработки на Python в Windows.

Онлайн-курсы для изучения Python

Введение в Python на Microsoft Learn. Попробуйте интерактивную платформу Microsoft Learn и получите навыки выполнения этого модуля, охватывающего основы написания базового кода Python, объявления переменных и работы с входными и выходными данными консоли. Интерактивная среда песочницы предоставляет эту отличную возможность начать пользователям, у которых еще не настроена среда разработки Python.

Python на Pluralsight: 8 курсов, 29 часов. Схема обучения Python на Pluralsight предлагает онлайн-курсы, охватывающие различные темы, связанные с Python, включая средство для измерения навыков и поиска пробелов в знаниях.

Учебники на сайте LearnPython.org. Приступите к изучению Python без необходимости дополнительной установки или настройки с помощью этих бесплатных интерактивных учебников по Python от DataCamp.

Учебники на сайте Python.org. Предоставляют читателям неформальное описание основных понятий и функций языка и системы Python.

Работа с Python в VS Code

Редактирование Python в VS Code. Узнайте больше о том, как воспользоваться преимуществами автозаполнения VS Code и поддержкой IntelliSense для Python, включая их настройку или отключение.

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

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

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

Code editing. Redefined.

Free. Built on open source. Runs everywhere.

By using VS Code, you agree to its license and privacy statement.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Meet IntelliSense.

Go beyond syntax highlighting and autocomplete with IntelliSense, which provides smart completions based on variable types, function definitions, and imported modules.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Print statement debugging is a thing of the past.

Debug code right from the editor. Launch or attach to your running apps and debug with break points, call stacks, and an interactive console.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Git commands built-in.

Working with Git and other SCM providers has never been easier. Review diffs, stage files, and make commits right from the editor. Push and pull from any hosted SCM service.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Extensible and customizable.

Want even more features? Install extensions to add new languages, themes, debuggers, and to connect to additional services. Extensions run in separate processes, ensuring they won’t slow down your editor. Learn more about extensions.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Deploy with confidence and ease

With Microsoft Azure you can deploy and host your React, Angular, Vue, Node, Python (and more!) sites, store and query relational and document based data, and scale with serverless computing, all with ease, all from within VS Code.

VS Code for

Want new features sooner?

Use vscode.dev for quick edits online!

GitHub, Azure Repos, and local files.

License and Privacy Terms

By downloading and using Visual Studio Code, you agree to the license terms and privacy statement. VS Code automatically sends telemetry data and crash dumps to help us improve the product. If you would prefer not to have this data sent please go see How to Disable Crash Reporting to learn how to disable it.

Getting Started With Visual Studio Code

Visual Studio Code is a lightweight code editor from Microsoft. It comes with built-in support for JavaScript, TypeScript and Node.js and is available for Windows, MacOS and Linux. Additional functionality can be added to Visual Studio Code by using Extensions. In the following you’ll learn how to setup VS Code and we’ll explore the basic functionality of the code editor.

Installation

The installation of Visual Studio Code depends on your platform. First go to the project’s website at https://code.visualstudio.com and download the package which is right for your operating system.

MaCOS

If your platform is MacOS, the installation is very easy. Download the Visual Studio Code archive, double click to unpack the archive and drag the file Visual Studio Code.app to the Applications folder.

Windows

Linux

The installation of Visual Studio Code under Linux depends on the distribution you’re using. For a distribution-specifc installation guides take a look at https://code.visualstudio.com/docs/setup/linux.

Adding Visual Studio Code To The Command Line

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

User Interface

The user interface of Visual Studio Code is split up into different areas:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Zen Mode

Visual Studio Code offers a Zen Mode which let’s you focus on the code. In this mode all other user interface elements are hidden and only the editor area is visible. To switch to Zen Mode use the key shortcut ⌘K Z. To leave the Zen Mode you need to hit ESC two times.

Working With The Code Editor

The Code Editor is a powerful tool. You can open up to three files side by side as you can see in the following:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

There are different ways of opening up a file side by side:

IntelliSense

The code editor has a feature which is called IntelliSense. IntelliSense features could be described as code completion, content assist and code hinting. By default IntelliSense features are available for the following languages: JavaScript, TypeScript, JSON, HTML, CSS, Less and Sass.

If IntelliSense is available, suggestions will pop up as you type. If you continue typing, the list of suggestions is filtered to include only members containing your typed characters. You can press Tab or Enter to accept and insert the current suggestion.

You can also activate IntelliSense explicitly by using keycode ⌃Space.

Quick File Navigation

To quickly open files type ⌘P. The following input dialog appears:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

As you can see you can start typing immediately and you’ll get back a result list with matching file names.

Searching

By clicking on symbol

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

in the View Bar you can open the Search View in the Side Bar which looks like the following:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

This view can be used to search across files of the current project. You can also open the view by using keys Ctrl+Shift+F. In the open search view you can start typing and the matching results will be shown after pressing enter:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Using The Command Palette

All functions of Visual Studio Code can be accessed via keyboard only. To do so, just make use of the command palette (Ctrl+Shift+P):

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

You can start typing in the input field of the Command Palette and you’ll receive a list of matching commands instantly.

User And Workspace Settings

Configuration of Visual Studio Code can be done in two different scopes:

You can use the Command Palette to open user or workspace settings. Just type in Preferences: Open User Settings or Preferences: Open Workspace Settings and hit enter. The following view opens:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

On the left side you can see all default settings of Visual Studio Code. You can copy and paste the default settings to the right side to override a settings with a new value:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Changes to settings are activated automatically after the settings.json file on the right side is saved.

Integrated Terminal

Visual Studio Code contains an integrated terminal, so that you can execute terminal commands from within the application. The terminal is available in the Panels area. You can create multiple terminal instances, as you can see in the following:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Extensions

Extensions are an easy way to extend the out-of-the-box functionality of Visual Studio Code. You can browse and install VS Code extensions from the Extensions view in the Side Bar. To open that view just click on the Extension Icon in the Activity Bar on the left. The following view will open:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

You can also search for extensions in the Visual Studio Code Marketplace https://marketplace.visualstudio.com/VSCode.

In the extensions view you can search for extensions. The list of results is presented in the Side Bar area. You can select an extension from the list and the extensions’s details page is presented on the right side:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Video Tutorial

This video tutorial contains the steps described in the text above:

Vs code install

Getting Started with Python in VS Code

In this tutorial, you use Python 3 to create the simplest Python «Hello World» application in Visual Studio Code. By using the Python extension, you make VS Code into a great lightweight Python IDE (which you may find a productive alternative to PyCharm).

This tutorial introduces you to VS Code as a Python environment, primarily how to edit, run, and debug code through the following tasks:

This tutorial is not intended to teach you Python itself. Once you are familiar with the basics of VS Code, you can then follow any of the programming tutorials on python.org within the context of VS Code for an introduction to the language.

If you have any problems, feel free to file an issue for this tutorial in the VS Code documentation repository.

To successfully complete this tutorial, you need to first setup your Python development environment. Specifically, this tutorial requires:

Install Visual Studio Code and the Python Extension

If you have not already done so, install VS Code.

Next, install the Python extension for VS Code from the Visual Studio Marketplace. For additional details on installing extensions, see Extension Marketplace. The Python extension is named Python and it’s published by Microsoft.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Install a Python interpreter

Along with the Python extension, you need to install a Python interpreter. Which interpreter you use is dependent on your specific needs, but some guidance is provided below.

Install Python from python.org. You can typically use the Download Python button that appears first on the page to download the latest version.

Note : If you don’t have admin access, an additional option for installing Python on Windows is to use the Microsoft Store. The Microsoft Store provides installs of Python 3.7, Python 3.8, Python 3.9, and Python 3.10.

For additional information about using Python on Windows, see Using Python on Windows at Python.org

The system install of Python on macOS is not supported. Instead, a package management system like Homebrew is recommended. To install Python using Homebrew on macOS use brew install python3 at the Terminal prompt.

Note On macOS, make sure the location of your VS Code installation is included in your PATH environment variable. See these setup instructions for more information.

The built-in Python 3 installation on Linux works well, but to install other Python packages you must install pip with get-pip.py.

Data Science: If your primary purpose for using Python is Data Science, then you might consider a download from Anaconda. Anaconda provides not just a Python interpreter, but many useful libraries and tools for data science.

Verify the Python installation

To verify that you’ve installed Python successfully on your machine, run one of the following commands (depending on your operating system):

Linux/macOS: open a Terminal Window and type the following command:

Windows: open a command prompt and run the following command:

If the installation was successful, the output window should show the version of Python that you installed.

Start VS Code in a project (workspace) folder

Note : If you’re using an Anaconda distribution, be sure to use an Anaconda command prompt.

Alternately, you can run VS Code through the operating system UI, then use File > Open Folder to open the project folder.

Select a Python interpreter

Python is an interpreted language, and in order to run Python code and get Python IntelliSense, you must tell VS Code which interpreter to use.

From within VS Code, select a Python 3 interpreter by opening the Command Palette ( kb(workbench.action.showCommands) ), start typing the Python: Select Interpreter command to search, then select the command. You can also use the Select Python Environment option on the Status Bar if available (it may already show a selected interpreter, too):

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

The command presents a list of available interpreters that VS Code can find automatically, including virtual environments. If you don’t see the desired interpreter, see Configuring Python environments.

Selecting an interpreter sets which interpreter will be used by the Python extension for that workspace.

Note : If you select an interpreter without a workspace folder open, VS Code sets python.defaultInterpreterPath in User scope instead, which sets the default interpreter for VS Code in general. The user setting makes sure you always have a default interpreter for Python projects. The workspace settings lets you override the user setting.

Create a Python Hello World source code file

From the File Explorer toolbar, select the New File button on the hello folder:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Note : The File Explorer toolbar also allows you to create folders within your workspace to better organize your code. You can use the New folder button to quickly create a folder.

Now that you have a code file in your Workspace, enter the following source code in hello.py :

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

IntelliSense and auto-completions work for standard Python modules as well as other packages you’ve installed into the environment of the selected Python interpreter. It also provides completions for methods available on object types. For example, because the msg variable contains a string, IntelliSense provides string methods when you type msg. :

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Feel free to experiment with IntelliSense some more, but then revert your changes so you have only the msg variable and the print call, and save the file ( kb(workbench.action.files.save) ).

For full details on editing, formatting, and refactoring, see Editing code. The Python extension also has full support for Linting.

Run Hello World

It’s simple to run hello.py with Python. Just click the Run Python File in Terminal play button in the top-right side of the editor.

The button opens a terminal panel in which your Python interpreter is automatically activated, then runs python3 hello.py (macOS/Linux) or python hello.py (Windows):

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

There are three other ways you can run Python code within VS Code:

Right-click anywhere in the editor window and select Run Python File in Terminal (which saves the file automatically):

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Select one or more lines, then press kbstyle(Shift+Enter) or right-click and select Run Selection/Line in Python Terminal. This command is convenient for testing just a part of a file.

From the Command Palette ( kb(workbench.action.showCommands) ), select the Python: Start REPL command to open a REPL terminal for the currently selected Python interpreter. In the REPL, you can then enter and run lines of code one at a time.

Configure and run the debugger

Let’s now try debugging our simple Hello World program.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Note: VS Code uses JSON files for all of its various configurations; launch.json is the standard name for a file containing debugging configurations.

These different configurations are fully explained in Debugging configurations; for now, just select Python File, which is the configuration that runs the current file shown in the editor using the currently selected Python interpreter.

You can also start the debugger by clicking on the down-arrow next to the run button on the editor, and selecting Debug Python File in Terminal.

The debugger will stop at the first line of the file breakpoint. The current line is indicated with a yellow arrow in the left margin. If you examine the Local variables window at this point, you will see now defined msg variable appears in the Local pane.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

A debug toolbar appears along the top with the following commands from left to right: continue ( kb(workbench.action.debug.start) ), step over ( kb(workbench.action.debug.stepOver) ), step into ( kb(workbench.action.debug.stepInto) ), step out ( kb(workbench.action.debug.stepOut) ), restart ( kb(workbench.action.debug.restart) ), and stop ( kb(workbench.action.debug.stop) ).

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

The Status Bar also changes color (orange in many themes) to indicate that you’re in debug mode. The Python Debug Console also appears automatically in the lower right panel to show the commands being run, along with the program output.

To continue running the program, select the continue command on the debug toolbar ( kb(workbench.action.debug.start) ). The debugger runs the program to the end.

You can also work with variables in the Debug Console (If you don’t see it, select Debug Console in the lower right area of VS Code, or select it from the . menu.) Then try entering the following lines, one by one, at the > prompt at the bottom of the console:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Select the blue Continue button on the toolbar again (or press F5) to run the program to completion. «Hello World» appears in the Python Debug Console if you switch back to it, and VS Code exits debugging mode once the program is complete.

If you restart the debugger, the debugger again stops on the first breakpoint.

To stop running a program before it’s complete, use the red square stop button on the debug toolbar ( kb(workbench.action.debug.stop) ), or use the Run > Stop debugging menu command.

For full details, see Debugging configurations, which includes notes on how to use a specific Python interpreter for debugging.

Tip: Use Logpoints instead of print statements: Developers often litter source code with print statements to quickly inspect variables without necessarily stepping through each line of code in a debugger. In VS Code, you can instead use Logpoints. A Logpoint is like a breakpoint except that it logs a message to the console and doesn’t stop the program. For more information, see Logpoints in the main VS Code debugging article.

Install and use packages

Let’s now run an example that’s a little more interesting. In Python, packages are how you obtain any number of useful code libraries, typically from PyPI. For this example, you use the matplotlib and numpy packages to create a graphical plot as is commonly done with data science. (Note that matplotlib cannot show graphs when running in the Windows Subsystem for Linux as it lacks the necessary UI support.)

Next, try running the file in the debugger using the «Python: Current file» configuration as described in the last section.

Unless you’re using an Anaconda distribution or have previously installed the matplotlib package, you should see the message, «ModuleNotFoundError: No module named ‘matplotlib'». Such a message indicates that the required package isn’t available in your system.

To install the matplotlib package (which also installs numpy as a dependency), stop the debugger and use the Command Palette to run Terminal: Create New Terminal ( kb(workbench.action.terminal.new) ). This command opens a command prompt for your selected interpreter.

A best practice among Python developers is to avoid installing packages into a global interpreter environment. You instead use a project-specific virtual environment that contains a copy of a global interpreter. Once you activate that environment, any packages you then install are isolated from other environments. Such isolation reduces many complications that can arise from conflicting package versions. To create a virtual environment and install the required packages, enter the following commands as appropriate for your operating system:

Note : For additional information about virtual environments, see Environments.

Create and activate the virtual environment

Note : When you create a new virtual environment, you should be prompted by VS Code to set it as the default for your workspace folder. If selected, the environment will automatically be activated when you open a new terminal.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

For Windows

If the activate command generates the message «Activate.ps1 is not digitally signed. You cannot run this script on the current system.», then you need to temporarily change the PowerShell execution policy to allow scripts to run (see About Execution Policies in the PowerShell documentation):

For macOS/Linux

Select your new environment by using the Python: Select Interpreter command from the Command Palette.

Install the packages

Rerun the program now (with or without the debugger) and after a few moments a plot window appears with the output:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Once you are finished, type deactivate in the terminal window to deactivate the virtual environment.

For additional examples of creating and activating a virtual environment and installing packages, see the Django tutorial and the Flask tutorial.

You can configure VS Code to use any Python environment you have installed, including virtual and conda environments. You can also use a separate environment for debugging. For full details, see Environments.

To learn more about the Python language, follow any of the programming tutorials listed on python.org within the context of VS Code.

To learn to build web apps with the Django and Flask frameworks, see the following tutorials:

There is then much more to explore with Python in Visual Studio Code:

Vs code install

Configure VS Code for Microsoft C++

In this tutorial, you configure Visual Studio Code to use the Microsoft Visual C++ compiler and debugger on Windows.

After configuring VS Code, you will compile and debug a simple Hello World program in VS Code. This tutorial does not teach you details about the Microsoft C++ toolset or the C++ language. For those subjects, there are many good resources available on the Web.

If you have any problems, feel free to file an issue for this tutorial in the VS Code documentation repository.

To successfully complete this tutorial, you must do the following:

Install the C/C++ extension for VS Code. You can install the C/C++ extension by searching for ‘c++’ in the Extensions view ( kb(workbench.view.extensions) ).

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Install the Microsoft Visual C++ (MSVC) compiler toolset.

If you have a recent version of Visual Studio, open the Visual Studio Installer from the Windows Start menu and verify that the C++ workload is checked. If it’s not installed, then check the box and select the Modify button in the installer.

You can also install the Desktop development with C++ workload without a full Visual Studio IDE installation. From the Visual Studio Downloads page, scroll down until you see Tools for Visual Studio 2022 under the All Downloads section and select the download for Build Tools for Visual Studio 2022.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

This will launch the Visual Studio Installer, which will bring up a dialog showing the available Visual Studio Build Tools workloads. Check the Desktop development with C++ workload and select Install.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Note : You can use the C++ toolset from Visual Studio Build Tools along with Visual Studio Code to compile, build, and verify any C++ codebase as long as you also have a valid Visual Studio license (either Community, Pro, or Enterprise) that you are actively using to develop that C++ codebase.

Check your Microsoft Visual C++ installation

To use MSVC from a command line or VS Code, you must run from a Developer Command Prompt for Visual Studio. An ordinary shell such as PowerShell, Bash, or the Windows command prompt does not have the necessary path environment variables set.

To open the Developer Command Prompt for VS, start typing ‘developer’ in the Windows Start menu, and you should see it appear in the list of suggestions. The exact name depends on which version of Visual Studio or the Visual Studio Build Tools you have installed. Select the item to open the prompt.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

If the Developer Command Prompt is using the BuildTools location as the starting directory (you wouldn’t want to put projects there), navigate to your user folder ( C:\users\\ ) before you start creating new projects.

Note : If for some reason you can’t run VS Code from a Developer Command Prompt, you can find a workaround for building C++ projects with VS Code in Run VS Code outside a Developer Command Prompt.

Create Hello World

Add a source code file

Add hello world source code

Now paste in this source code:

Now press kb(workbench.action.files.save) to save the file. Notice how the file you just added appears in the File Explorer view ( kb(workbench.view.explorer) ) in the side bar of VS Code:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

You can also enable Auto Save to automatically save your file changes, by checking Auto Save in the main File menu.

The Activity Bar on the far left lets you open different views such as Search, Source Control, and Run. You’ll look at the Run view later in this tutorial. You can find out more about the other views in the VS Code User Interface documentation.

Note : When you save or open a C++ file, you may see a notification from the C/C++ extension about the availability of an Insiders version, which lets you test new features and fixes. You can ignore this notification by selecting the X (Clear Notification).

In your new helloworld.cpp file, hover over vector or string to see type information. After the declaration of the msg variable, start typing msg. as you would when calling a member function. You should immediately see a completion list that shows all the member functions, and a window that shows the type information for the msg object:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

You can press the kbstyle(Tab) key to insert the selected member; then, when you add the opening parenthesis, you will see information about any arguments that the function requires.

Remember, the C++ extension uses the C++ compiler you have installed on your machine to build your program. Make sure you have a C++ compiler installed before attempting to run and debug helloworld.cpp in VS Code.

Open helloworld.cpp so that it is the active file.

Press the play button in the top right corner of the editor.

Choose C/C++: cl.exe build and debug active file from the list of detected compilers on your system.

After the build succeeds, your program’s output will appear in the integrated Terminal.

Your new tasks.json file should look similar to the JSON below:

Note : You can learn more about tasks.json variables in the variables reference.

The command setting specifies the program to run; in this case that is «cl.exe». The args array specifies the command-line arguments that will be passed to cl.exe. These arguments must be specified in the order expected by the compiler.

The label value is what you will see in the tasks list; you can name this whatever you like.

The detail value is what you will as the description of the task in the tasks list. It’s highly recommended to rename this value to differentiate it from similar tasks.

Explore the debugger

Before you start stepping through the code, let’s take a moment to notice several changes in the user interface:

The Integrated Terminal appears at the bottom of the source code editor. In the Debug Output tab, you see output that indicates the debugger is up and running.

The editor highlights the line where you set a breakpoint before starting the debugger:

The Run and Debug view on the left shows debugging information. You’ll see an example later in the tutorial.

At the top of the code editor, a debugging control panel appears. You can move this around the screen by grabbing the dots on the left side.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Step through the code

Now you’re ready to start stepping through the code.

Click or press the Step over icon in the debugging control panel.

This will advance program execution to the first line of the for loop, and skip over all the internal function calls within the vector and string classes that are invoked when the msg variable is created and initialized. Notice the change in the Variables window on the left.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

In this case, the errors are expected because, although the variable names for the loop are now visible to the debugger, the statement has not executed yet, so there is nothing to read at this point. The contents of msg are visible, however, because that statement has completed.

Press Step over again to advance to the next statement in this program (skipping over all the internal code that is executed to initialize the loop). Now, the Variables window shows information about the loop variables.

Press Step over again to execute the cout statement. (Note that as of the March 2019 release, the C++ extension does not print any output to the Debug Console until the loop exits.)

If you like, you can keep pressing Step over until all the words in the vector have been printed to the console. But if you are curious, try pressing the Step Into button to step through source code in the C++ standard library!

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Sometimes you might want to keep track of the value of a variable as your program executes. You can do this by setting a watch on the variable.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

To quickly view the value of any variable while execution is paused on a breakpoint, you can hover over it with the mouse pointer.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Customize debugging with launch.json

There are cases where you’d want to customize your debug configuration, such as specifying arguments to pass to the program at runtime. You can define custom debug configurations in a launch.json file.

You’ll then see a dropdown for various predefined debugging configurations. Choose C/C++: cl.exe build and debug active file.

VS Code creates a launch.json file, which looks something like this:

Change the stopAtEntry value to true to cause the debugger to stop on the main method when you start debugging.

From now on, the play button and kb(workbench.action.debug.start) will read from your launch.json file when launching your program for debugging.

If you want more control over the C/C++ extension, you can create a c_cpp_properties.json file, which will allow you to change settings such as the path to the compiler, include paths, C++ standard (default is C++17), and more.

You can view the C/C++ configuration UI by running the command C/C++: Edit Configurations (UI) from the Command Palette ( kb(workbench.action.showCommands) ).

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

You only need to add to the Include path array setting if your program includes header files that are not in your workspace or in the standard library path.

The compilerPath setting is an important setting in your configuration. The extension uses it to infer the path to the C++ standard library header files. When the extension knows where to find those files, it can provide useful features like smart completions and Go to Definition navigation.

The C/C++ extension attempts to populate compilerPath with the default compiler location based on what it finds on your system. The extension looks in several common compiler locations.

The compilerPath search order is:

If you have g++ or WSL installed, you might need to change compilerPath to match the preferred compiler for your project. For Microsoft C++, the path should look something like this, depending on which specific version you have installed: «C:/Program Files (x86)/Microsoft Visual Studio/2017/BuildTools/VC/Tools/MSVC/14.16.27023/bin/Hostx64/x64/cl.exe».

Reusing your C++ configuration

Run VS Code outside the Developer Command Prompt

In certain circumstances, it isn’t possible to run VS Code from Developer Command Prompt for Visual Studio (for example, in Remote Development through SSH scenarios). In that case, you can automate initialization of Developer Command Prompt for Visual Studio during the build using the following tasks.json configuration:

The term ‘cl.exe’ is not recognized

If you see the error «The term ‘cl.exe’ is not recognized as the name of a cmdlet, function, script file, or operable program.», this usually means you are running VS Code outside of a Developer Command Prompt for Visual Studio and VS Code doesn’t know the path to the cl.exe compiler.

VS Code must either be started from the Developer Command Prompt for Visual Studio, or the task must be configured to run outside a Developer Command Prompt.

Python in Visual Studio Code

Working with Python in Visual Studio Code, using the Microsoft Python extension, is simple, fun, and productive. The extension makes VS Code an excellent Python editor, and works on any operating system with a variety of Python interpreters. It leverages all of VS Code’s power to provide auto complete and IntelliSense, linting, debugging, and unit testing, along with the ability to easily switch between Python environments, including virtual and conda environments.

This article provides only an overview of the different capabilities of the Python extension for VS Code. For a walkthrough of editing, running, and debugging code, use the button below.

Install Python and the Python extension

The tutorial guides you through installing Python and using the extension. You must install a Python interpreter yourself separately from the extension. For a quick install, use Python from python.org and install the extension from the VS Code Marketplace.

You can configure the Python extension through settings. Learn more in the Python Settings reference.

Run Python code

To experience Python, create a file (using the File Explorer) named hello.py and paste in the following code:

The Python extension then provides shortcuts to run Python code in the currently selected interpreter (Python: Select Interpreter in the Command Palette):

You can also use the Terminal: Create New Terminal command to create a terminal in which VS Code automatically activates the currently selected interpreter. See Environments below. The Python: Start REPL activates a terminal with the currently selected interpreter and then runs the Python REPL.

For a more specific walkthrough on running code, see the tutorial.

Autocomplete and IntelliSense

The Python extension supports code completion and IntelliSense using the currently selected interpreter. IntelliSense is a general term for a number of features, including intelligent code completion (in-context method and variable suggestions) across all your files and for built-in and third-party modules.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Tip: Check out the IntelliCode extension for VS Code (preview). IntelliCode provides a set of AI-assisted capabilities for IntelliSense in Python, such as inferring the most relevant auto-completions based on the current code context.

Linting

Linting analyzes your Python code for potential errors, making it easy to navigate to and correct different problems.

The Python extension can apply a number of different linters including Pylint, pycodestyle, Flake8, mypy, pydocstyle, prospector, and pylama. See Linting.

Debugging

No more print statement debugging! Set breakpoints, inspect data, and use the debug console as you run your program step by step. Debug a number of different types of Python applications, including multi-threaded, web, and remote applications.

For Python-specific details, including setting up your launch.json configuration and remote debugging, see Debugging. General VS Code debugging information is found in the debugging document. The Django and Flask tutorials also demonstrate debugging in the context of those web apps, including debugging Django page templates.

Environments

The Python extension automatically detects Python interpreters that are installed in standard locations. It also detects conda environments as well as virtual environments in the workspace folder. See Configuring Python environments.

The current environment is shown on the left side of the VS Code Status Bar:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

The Status Bar also indicates if no interpreter is selected:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

The selected environment is used for IntelliSense, auto-completions, linting, formatting, and any other language-related feature other than debugging. It is also activated when you run Python in a terminal.

To change the current interpreter, which includes switching to conda or virtual environments, select the interpreter name on the Status Bar or use the Python: Select Interpreter command.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

VS Code prompts you with a list of detected environments as well as any you’ve added manually to your user settings (see Configuring Python environments).

Installing packages

Packages are installed using the Terminal panel and commands like pip install

(Windows) and pip3 install

(macOS/Linux). VS Code installs that package into your project along with its dependencies. Examples are given in the Python tutorial as well as the Django and Flask tutorials.

Jupyter notebooks

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

You can also convert and open the notebook as a Python code file. The notebook’s cells are delimited in the Python file with #%% comments, and the Python extension shows Run Cell or Run All Cells CodeLens. Selecting either CodeLens starts the Jupyter server and runs the cell(s) in the Python interactive window:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Opening a notebook as a Python file allows you to use all of VS Code’s debugging capabilities. You can then save the notebook file and open it again as a notebook in the Notebook Editor, Jupyter, or even upload it to a service like Azure Notebooks.

Using either method, Notebook Editor or a Python file, you can also connect to a remote Jupyter server for running the code. For more information, see Jupyter support.

Testing

The Python extension supports testing with unittest and pytest.

To run tests, you enable one of the frameworks in settings. Each framework also has specific settings, such as arguments that identify paths and patterns for test discovery.

Once discovered, VS Code provides a variety of commands (on the Status Bar, the Command Palette, and elsewhere) to run and debug tests, including the ability to run individual test files and individual methods.

Configuration

The Python extension provides a wide variety of settings for its various features. These are described on their relevant topics, such as Editing code, Linting, Debugging, and Testing. The complete list is found in the Settings reference.

Other popular Python extensions

The Microsoft Python extension provides all of the features described previously in this article. Additional Python language support can be added to VS Code by installing other popular Python extensions.

The extensions shown above are dynamically queried. Click on an extension tile above to read the description and reviews to decide which extension is best for you. See more in the Marketplace.

Настройка рабочей среды

Установка и настройка VS Code

Установка VS Code

Установка VS Code не представляет сложностей. Достаточно скачать установочный файл со страницы загрузок и запустить его.

Теперь настроим VS Code для удобной работы с языками C++ и Python.

Расширения VS Code

Установите следующие расширения VS Code:

Выбор интерпретатора python

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Можете, например, выбрать интерпретатор из недавно созданного окружения nsu.

Исполнить этот скрипт можно, открыв консоль в VS Code с помощью сочетания клавиш Ctrl+J и набрав в ней

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

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Настройка работы с GCC

Скомпилируем его с помощью компилятора GCC и командной строки. Откройте консоль в VS Code ( Ctrl+J ) и исполните команду

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Работа с CMake

и файл CMakeLists.txt со следующим содержанием:

Выполните настройку проекта и запустите сборку:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Работа с git

Покажем как можно работать с git-репозиторием через VS Code. Выполните fork репозитория задания Hello, Classroom на GitHub:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Это действие создает новый репозиторий в Вашем аккаунте. Разрешите автоматическое тестирование решения, нажав на большую зеленую кнопку во вкладке Actions:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Новый репозиторий необходимо клонировать на Вашу локальную систему. Удобнее всего это делать с помощью протокола ssh. Для этого сначала необходимо включить OpenSSH Client, который по умолчанию выключен.

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

По умолчанию сгенерированные ключи будут расположены в директории

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Теперь мы готовы к клонированию репозитория. Выберите на компьютере директорию, в которой Вы будете работать с заданиями курса и перейдите в неё. Откройте страницу репозитория hello-classroom в Вашем аккаунте GitHub и скопируйте строку для клонирования через ssh:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Выполните в консоли команду git clone :

Тесты пройдены успешны. Значит, мы готовы к синхронизации репозитория GitHub с нашей локальной версией. В командной строке для этого достаточно выполнить следующие команды:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Code editing. Redefined.

Free. Built on open source. Runs everywhere.

By using VS Code, you agree to its license and privacy statement.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Meet IntelliSense.

Go beyond syntax highlighting and autocomplete with IntelliSense, which provides smart completions based on variable types, function definitions, and imported modules.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Print statement debugging is a thing of the past.

Debug code right from the editor. Launch or attach to your running apps and debug with break points, call stacks, and an interactive console.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Git commands built-in.

Working with Git and other SCM providers has never been easier. Review diffs, stage files, and make commits right from the editor. Push and pull from any hosted SCM service.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Extensible and customizable.

Want even more features? Install extensions to add new languages, themes, debuggers, and to connect to additional services. Extensions run in separate processes, ensuring they won’t slow down your editor. Learn more about extensions.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Deploy with confidence and ease

With Microsoft Azure you can deploy and host your React, Angular, Vue, Node, Python (and more!) sites, store and query relational and document based data, and scale with serverless computing, all with ease, all from within VS Code.

VS Code for

Want new features sooner?

Use vscode.dev for quick edits online!

GitHub, Azure Repos, and local files.

License and Privacy Terms

By downloading and using Visual Studio Code, you agree to the license terms and privacy statement. VS Code automatically sends telemetry data and crash dumps to help us improve the product. If you would prefer not to have this data sent please go see How to Disable Crash Reporting to learn how to disable it.

Code editing. Redefined.

Free. Built on open source. Runs everywhere.

By using VS Code, you agree to its license and privacy statement.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Meet IntelliSense.

Go beyond syntax highlighting and autocomplete with IntelliSense, which provides smart completions based on variable types, function definitions, and imported modules.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Print statement debugging is a thing of the past.

Debug code right from the editor. Launch or attach to your running apps and debug with break points, call stacks, and an interactive console.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Git commands built-in.

Working with Git and other SCM providers has never been easier. Review diffs, stage files, and make commits right from the editor. Push and pull from any hosted SCM service.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Extensible and customizable.

Want even more features? Install extensions to add new languages, themes, debuggers, and to connect to additional services. Extensions run in separate processes, ensuring they won’t slow down your editor. Learn more about extensions.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Deploy with confidence and ease

With Microsoft Azure you can deploy and host your React, Angular, Vue, Node, Python (and more!) sites, store and query relational and document based data, and scale with serverless computing, all with ease, all from within VS Code.

VS Code for

Want new features sooner?

Use vscode.dev for quick edits online!

GitHub, Azure Repos, and local files.

License and Privacy Terms

By downloading and using Visual Studio Code, you agree to the license terms and privacy statement. VS Code automatically sends telemetry data and crash dumps to help us improve the product. If you would prefer not to have this data sent please go see How to Disable Crash Reporting to learn how to disable it.

Vs code install

Setting up Visual Studio Code

Getting up and running with Visual Studio Code is quick and easy. It is a small download so you can install in a matter of minutes and give VS Code a try.

VS Code is a free code editor, which runs on the macOS, Linux, and Windows operating systems.

Follow the platform-specific guides below:

VS Code is lightweight and should run on most available hardware and platform versions. You can review the System Requirements to check if your computer configuration is supported.

VS Code releases a new version each month with new features and important bug fixes. Most platforms support auto updating and you will be prompted to install the new release when it becomes available. You can also manually check for updates by running Help > Check for Updates on Linux and Windows or running Code > Check for Updates on macOS.

Note: You can disable auto-update if you prefer to update VS Code on your own schedule.

Insiders nightly build

If you’d like to try our nightly builds to see new features early or verify bug fixes, you can install our Insiders build. The Insiders build installs side-by-side with the monthly Stable build and you can freely work with either on the same machine. The Insiders build is the same one the VS Code development team uses on a daily basis and we really appreciate people trying out new features and providing feedback.

Visual Studio Code supports Portable mode installation. This mode enables all data created and maintained by VS Code to live near itself, so it can be moved around across environments, for example, on a USB drive. See the VS Code Portable Mode documentation for details.

VS Code is an editor, first and foremost, and prides itself on a small footprint. Unlike traditional IDEs that tend to include everything but the kitchen sink, you can tune your installation to the development technologies you care about. Be sure to read the Additional Components topic after reading the platform guides to learn about customizing your VS Code installation.

VS Code extensions let third parties add support for additional:

Extensions integrate into VS Code’s UI, commands, and task running systems so you’ll find it easy to work with different technologies through VS Code’s shared interface. Check out the VS Code extension Marketplace to see what’s available.

Once you have installed and set up VS Code, these topics will help you learn more about VS Code:

If you’d like to get something running quickly, try the Node.js tutorial walkthrough that will have you debugging a Node.js web application with VS Code in minutes.

What are the system requirements for VS Code?

How big is VS Code?

VS Code is a small download (

How do I create and run a new project?

VS Code doesn’t include a traditional File > New Project dialog or pre-installed project templates. You’ll need to add additional components and scaffolders depending on your development interests. With scaffolding tools like Yeoman and the multitude of modules available through the npm package manager, you’re sure to find appropriate templates and tools to create your projects.

How do I know which version I’m running?

On Linux and Windows, choose Help > About. On macOS, use Code > About Visual Studio Code.

Why is VS Code saying my installation is Unsupported?

VS Code has detected that some installation files have been modified, perhaps by an extension. Reinstalling VS Code will replace the affected files. See our FAQ topic for more details.

How can I do a ‘clean’ uninstall of VS Code?

The folder locations will vary depending on your platform:

October 2019 (version 1.40)

Update 1.40.1: The update addresses these issues.

Update 1.40.2: The update addresses these issues.

Welcome to the October 2019 release of Visual Studio Code. As announced in the October iteration plan, we focused on housekeeping GitHub issues and pull requests as documented in our issue grooming guide. Across all of our VS Code repositories, we closed (either triaged or fixed) 4622 issues, which is even more than during our last housekeeping iteration in September 2018, where we closed 3918 issues. While we closed issues, you created 2195 new issues. This resulted in a net reduction of 2427 issues. The main vscode repository now has 2162 open feature requests and 725 open bugs. In addition, we closed 287 pull requests. As part of this effort, we have also tuned our process and updated the issue triaging workflow.

Same as last year, we used the live tracker from Benjamin Lannon to track our progress:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

During this housekeeping milestone, we also addressed several feature requests and community pull requests. Read on to learn about new features and settings.

Workbench

Activity Bar indicator

We’ve introduced a new indicator for the active item in Activity Bar to make it stand out better and increase readability. We also tuned the inactive foreground colors for a stronger contrast with the active element.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Themable window border

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

List and tree keyboard scrolling

You can now press ⌘↑ (Windows, Linux Ctrl+Up ) and ⌘↓ (Windows, Linux Ctrl+Down ) to scroll lists and trees using the keyboard.

Fewer notifications in Zen mode

While using Zen mode, notification toasts will no longer distract you unless they inform about errors. You can control this behavior with the new zenMode.silentNotifications setting. You can always access all notifications from the status bar by clicking on the notification icon in the bottom-right corner.

Type filters for outline and breadcrumbs

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

The screen shot above shows the Outline view configured to not show local variables and you can see that the variable hidden isn’t shown.

Note that it’s up to the language extension to assign the type of a symbol. You can hover over the symbol label in the Outline view to see which symbol type is being used (shown in parentheses).

Control the sizing behavior when splitting editors

A new setting workbench.editor.splitSizing controls the layout of editors when splitting them. By default, the size will be distributed evenly among all editors as shown below:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Change this setting to split for the current editor to be split in half and not affect the size of other editors:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Disable GPU acceleration

To make life easier, you can add this flag as a setting so that it does not have to be passed on the command line each time.

To add this flag:

Note: Do not use this setting unless you are seeing issues!

Editor

files.eol per language

The files.eol setting can now be set per language. For example, you could define that all files of ‘mylanguage’ language identifier use \n as the default end-of-line sequence for all new files.

The end-of-line sequence is used for new files. For existing files, the current end-of-line sequence is always preserved. To change the end-of-line sequence for an existing file, use the Change End Of Line Sequence command.

Minimap scaling and improved font rendering

A new setting editor.minimap.scale configures the minimap’s size to one of several constant values, particularly useful for high DPI or ultra-wide displays. Also, the rendering of the minimap’s font is now smoother and clearer.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Definition Preview Hover from the keyboard

There is a new command Show Definition Preview Hover for better accessibility of the definition preview hover widget, which can be triggered by hovering a symbol with the mouse and pressing a modifier key dependent on the platform and configuration. Previously, only the command Show Hover was provided, which is equivalent to hovering the mouse cursor over a symbol. Now, with Show Definition Preview Hover, the detailed hover information can be shown via the keyboard.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Improvements to bracket matching

Previously, VS Code would only highlight matching brackets when the cursor was next to a bracket character. Now VS Code will always highlight enclosing brackets if they exist.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

We have also adjusted our Go to Bracket and Select to Bracket actions to use enclosing brackets.

Duplicate selection

We have added a new action named Duplicate Selection. When executed, the current selection will be duplicated and the result will be selected. When there is no selection, the current line will be duplicated, all without writing to the system clipboard.

Font feature settings

We now allow these font features to be explicitly controlled, for example:

The above settings configure the editor to use the Fira Code font family, turn on font ligatures for all languages, and in JavaScript files enable the ‘Horizontal Bar’ (‘ss02’) and the ‘Dotted zero’ (‘ss19’) font feature settings. These make the >= ligature render with a horizontal bar and the 0 render with a dot inside it in JavaScript:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Better handling for Unicode combining characters

We have made improvements around handling of Unicode combining characters and we treat such sequences as atomic characters (in cursor movement, editing operations, or in block cursor rendering). This is best demonstrated using the block cursor style and a before/after animation:

Before:
Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

After:
Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

In a related change, the status bar now shows the Unicode point count in the Col section.

Cursor Redo

The Soft Undo command has been renamed to Cursor Undo. This action is useful, for example when using ⌘D (Windows, Linux Ctrl+D ) to select the next match and going one time too far, as it undoes only the last cursor state change. Additionally, we now have added Cursor Redo, which redoes the previously undone cursor state change.

Diff editor improvements

The built-in diff computation used to have a hard-coded timeout of 5 seconds, after which it would give up and return a non-minimal diff. You can now configure this timeout using «diffEditor.maxComputationTime» and setting the timeout to 0 will always compute a minimal diff, no matter how long that would take. Additionally, the diff editor now renders a progress bar when the computation takes longer than one second.

A source of confusion when using the diff editor was when comparing files with only leading or trailing whitespace differences and the diff editor was configured to ignore trim whitespace. This would result in Source Control showing the files as modified, while the diff editor would render no diffs. VS Code now displays a Show Whitespace Differences button when it detects this case to help you quickly show diffs in whitespace. This can be toggled using the Show/Ignore Trim Trailing Whitespace Difference command at the top of the diff editor:

Integrated Terminal

Chords are now supported by default

The new setting terminal.integrated.allowChords (default true ) allows keybindings that are part of a chord keybinding to skip the terminal for evaluation and instead get handled by VS Code (bypassing the terminal.integrated.commandsToSkipShell allow list).

Note that the same limitations around keybindings in the terminal still apply; the chord keybinding with the highest priority will be considered when making this evaluation.

For example, if an extension contributes keybinding Ctrl+M A and you have the following defined in your keybindings.json file:

Ctrl+M A will result in the workbench.action.focusLastEditorGroup command executing since it’s the final keybinding and user keybindings are of higher priority than extension contributed keybindings.

Fast scroll support

The terminal now supports Alt with mouse wheel to scroll faster based on the multiplier defined in the editor.fastScrollSensitivity setting.

New «paste» option for right-click behavior

A new option has been added to the rightClickBehavior setting to always paste in the terminal on right-click:

Double-click to select word uses more separator characters

Symlink cwds are no longer resolved

If a terminal’s initial working directory is set to a symlink, the symlink will now be preserved in the terminal.

Command navigation now works from the scroll position

Command navigation enables navigating between or selecting between commands that have been run in the terminal. This now takes the scroll position of the terminal into account so you can scroll, find the previous command, and the terminal will scroll up from the terminal’s viewport (previously it would scroll from the bottom).

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Here are some example keybindings if you want to use this feature on Windows or Linux:

Tasks

Task Quick Pick lists

The new setting task.quickOpen.history controls how many tasks are shown in the task Quick Pick as recently used tasks. Set task.quickOpen.history to 0 to disable the recent tasks section of the tasks Quick Pick.

Option to run NPM scripts for a folder

When the setting npm.enableRunFromFolder is enabled, the File Explorer’s context menu shows the command Run NPM Script in Folder. when a folder is selected. The command shows a Quick Pick list of the NPM scripts contained in this folder and you can select the script to be executed as a task.

Slow task provider warning

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Disable task autodetection

Problem matcher prompt

In the past, any task without a problem matcher would need to have an empty problem matcher set in tasks.json to skip the problem matcher prompt. Now, you can use task.problemMatchers.neverPrompt to disable the problem matcher prompt for all tasks or for specific task types. There’s also a new option in the problem matcher prompt to disable the prompt.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Source Control

Highlight file on active editor change

The Source Control view will now automatically highlight the active editor file in its tree/list view:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Git: Improved untracked files management

You can now manage untracked files separately by using the Git: Untracked Changes setting. Choose the separate option, if you’d like to see untracked files in a separate group in the Source Control view. Choose hidden if you’d like to never see them. The default commit action will adjust itself to this setting and will only include untracked changes in a commit when using the mixed setting value.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Git: Automatic commit message on merge commits

Whenever VS Code detects you’re in a middle of a git merge commit, it will automatically populate the commit input box with Git’s default commit message.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Git: Reveal in Explorer

There’s now a context menu action Reveal in Explorer to reveal files in the File Explorer, from a Git repository in the Source Control view.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Git: Clone progress

The clone operation now supports displaying progress in the bottom-right corner notification:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Debugging

Breakpoints can be shown in overview ruler

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

PreLaunch tasks for compound debug configurations

Today every debug configuration can specify a task to be run before the debug session is started via the preLaunchTask attribute. This works well when debugging a single program, but it gets unwieldy when using compound configurations where multiple programs are involved.

In this milestone, we’ve added support for a preLaunchTask per compound debug configuration. With this addition, a single task can build all debug targets before the individual debug sessions are started. In case of a build error, no session is started.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Languages

CSS media query symbols

In CSS/SCSS/Less files, media query symbols are now shown in the Outline view, the breadcrumb path, and the Go to Symbols in File list:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

typescript.tsserver.maxTsServerMemory

If you are working with a large TypeScript project containing thousands of files, the new typescript.tsserver.maxTsServerMemory setting lets you increase the maximum memory usage for the TypeScript server that powers IntelliSense.

Extension authoring

vscode.env.uiKind

Call Hierarchy Provider API

We have finalized the call hierarchy provider API: CallHierarchyProvider. It supports the Peek Call Hierarchy feature, which finds callers to and calls from functions, methods, etc.

Task CustomExecution

The CustomExecution task type API has been finalized. If a shell or process task isn’t suitable for your task, you can use a CustomExecution task to execute a callback in your extension. Learn more in the task provider extension guide.

Debug API: «consoleMode» option for «startDebugging» request

In the last milestone, we had introduced a new proposed API for controlling whether a hierarchy of debug sessions shares a single Debug Console or use individual consoles. This API is now official so you can use it in extensions published on the Marketplace.

Icon color tokens

We’re excited to finally introduce new color tokens for our icons. We’re slowly adding these for certain areas, below is the first batch.

Symbols

These icons appear in the Outline view, breadcrumb navigation, and suggest widget.

Problems and Notifications

We’ve set the default colors for the problems and notifications icons to inherit from the editor foreground colors, so if you change those colors, it will inherit to the other areas:

You can also explicitly set the icon colors for the Problems panel and Notifications:

Lightbulb

The lightbulb icons are also themable:

vscode.env.asExternalUri

For http: and https: URIs, asExternalUri is a no-op if the extension is running on the client machine. However, if the extension is running remotely, vscode.env.asExternalUri automatically establishes a port forwarding tunnel from the local machine to target on the remote and returns a local URI to the tunnel.

Removal of experimental Custom Data settings and Contribution Points

[html/css].experimental.customData settings and contributes.[html/css].experimental.customData Contribution Points were deprecated in 1.38 and now removed. You can use the stable Custom Data settings and Contribution Points instead. To read more about the Custom Data Format, see the microsoft/vscode-custom-data repository.

extensionKind can be an array

Proposed extension APIs

Every milestone comes with new proposed APIs and extension authors can try them out. As always, we are keen on your feedback. This is what you have to do to try out a proposed API:

Note that you cannot publish an extension that uses a proposed API. There may be breaking changes in the next release and we never want to break existing extensions.

Support IntelliSense replace mode

We are working on a feature that allows users to decide if suggestions should replace existing text or just be inserted. For example, accepting console inside con|st can result in console (replace) or consolest (insert). Both modes have merit and it eventually depends on the current context and user preference. For this feature to work best, we need extensions to tell us what to do. Therefore we are proposing to add a new type to the CompletionItem#range property, changing it like this:

The range continues to be optional or be a simple range but it can also be two ranges: one for insert and one for replace. See Issue #10266 for more details.

Task detail

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Support for passing WebviewPanelOptions to Custom Editors

We continued our work on the Custom Editor API proposal this iteration. Now the proposed registerWebviewEditorProvider function takes a set of options that lets you enable retainContextWhenHidden and other features in custom editor webviews:

Engineering

Test VS Code running in a browser

There is now a minimal setup where VS Code can run in a browser that is available for development and testing. The browser instance is still missing some features and is under active development.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Note: Do not use this setup for any serious development. The intent is to allow the community to contribute changes back to VS Code to improve the overall experience in the browser.

Building VS Code with TypeScript 3.7

You can start using TypeScript 3.7 features in VS Code today by installing the JavaScript and TypeScript Nightly extension.

Electron 6.0 Update

In this milestone, we finished the exploration of bundling Electron 6 into VS Code, making it the first time this Electron version ships with stable. This is a major Electron release and comes with Chromium 76.0.3809.146 and Node.js 12.4.0 (a major leap forward from our current version with Chromium 69 and Node.js 10.11.0).

We have started to explore updating to Electron 7, which we hope to push to Insiders soon.

Notable fixes

Thank you

Last but certainly not least, a big Thank You! to the following folks that helped to make VS Code even better:

Contributions to our issue tracking:

Please see our Community Issue Tracking page, if you want to help us manage incoming issues.

Contributions to vscode :

Contributions to language-server-protocol :

Contributions to vscode-eslint :

Contributions to vscode-json-languageservice :

Contributions to vscode-css-languageservice :

Contributions to node-jsonc-parser :

Contributions to debug-adapter-protocol :

Contributions to vscode-vsce :

Contributions to inno-updater :

Contributions to localization :

There are over 800 Cloud + AI Localization community members using the Microsoft Localization Community Platform (MLCP), with over about 100 active contributors to Visual Studio Code. We appreciate your contributions, either by providing new translations, voting on translations, or suggesting process improvements.

Here is a snapshot of contributors. For details about the project including the contributor name list, visit the project site at https://aka.ms/vscodeloc.

Code editing. Redefined.

Free. Built on open source. Runs everywhere.

By using VS Code, you agree to its license and privacy statement.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Meet IntelliSense.

Go beyond syntax highlighting and autocomplete with IntelliSense, which provides smart completions based on variable types, function definitions, and imported modules.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Print statement debugging is a thing of the past.

Debug code right from the editor. Launch or attach to your running apps and debug with break points, call stacks, and an interactive console.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Git commands built-in.

Working with Git and other SCM providers has never been easier. Review diffs, stage files, and make commits right from the editor. Push and pull from any hosted SCM service.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Extensible and customizable.

Want even more features? Install extensions to add new languages, themes, debuggers, and to connect to additional services. Extensions run in separate processes, ensuring they won’t slow down your editor. Learn more about extensions.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Deploy with confidence and ease

With Microsoft Azure you can deploy and host your React, Angular, Vue, Node, Python (and more!) sites, store and query relational and document based data, and scale with serverless computing, all with ease, all from within VS Code.

VS Code for

Want new features sooner?

Use vscode.dev for quick edits online!

GitHub, Azure Repos, and local files.

License and Privacy Terms

By downloading and using Visual Studio Code, you agree to the license terms and privacy statement. VS Code automatically sends telemetry data and crash dumps to help us improve the product. If you would prefer not to have this data sent please go see How to Disable Crash Reporting to learn how to disable it.

September 2016 (version 1.6)

1.6.1 Recovery Build

We are releasing a 1.6.1 recovery build to add the final 1.6 translations and fix several important issues.

September Release Summary

Welcome to the September release of VS Code. There are a number of significant updates in this version that we hope you will like, some of the key highlights include:

The release notes are arranged in the following sections related to VS Code focus areas. Here are some further updates:

Workbench

Release notes inside VS Code

Icons Everywhere

Continuing on the work we did in the August release to support file icons, we’ve added file icons to many more places throughout the UI. This includes most trees that show files (for example, Problems panel, Search results, OPEN EDITORS section) as well as in Quick Open results and the editor headings.

Switch between running Windows

We added a new command to let you quickly move between open Windows of VS Code. Simply open the Command Palette ( ⇧⌘P (Windows, Linux Ctrl+Shift+P ) ) and type Switch Window. A dropdown will appear showing all the opened VS Code Windows (instances) and you can quickly move from one to the other without leaving the keyboard, right from within VS Code.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Image dimensions & Binary file size

When you open a binary file in VS Code, extra meta information is now displayed in the Status Bar. For all binary files, we show the size of the file and for images, we also show the image dimensions.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

VS Code also now detects image file changes on disk so you no longer see stale old versions of an image.

Editor

Format On Save

Would you like your source code formatted each time you save? VS Code now supports «Format On Save» which will automatically pick up relevant installed formatter extensions and format the whole document on each save. Enable «Format On Save» by setting «editor.formatOnSave»: true

Note: To keep cursors and selections stable, we don’t format when saving after delay.

Search term history

You can now navigate to your previous search terms in the global Search View and in the editor Find widget.

Hover & IntelliSense UI consistency

The Hover widget UI was updated aligning it more with VS Code’s IntelliSense experience:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Auto Save Menu Item

Auto Save is a great feature for many scenarios. In order to make this feature more discoverable, VS Code now has an Auto Save toggle right in the File menu. This will toggle the files.autoSave setting in your global User settings.json configuration file.

File Associations configuration

It is tedious to repeatedly set the Language Mode of a given file type and configuring a file association mapping was a manual process through your user or workspace settings. Now when changing the Language Mode of a file, you can pick Configure File Association for. and your choice will be stored to your User settings file and remembered.

Unicode improvements

VS Code now has better handling of UTF-16 surrogate pairs and validates all edits such that it doesn’t break up the surrogate pairs. This is particularly important if you want to add things like Emojis into your source code.

Improvements to LineNumber and Whitespace settings

Several editor settings have been updated to support new options:

Languages

TypeScript 2

VS Code 1.6 now ships with TypeScript 2.0.3. You can do the following to go back to TypeScript 1.8.10 in your workspace:

TypeScript

TypeScript 2.0.3 contains lots of new features, like strict null checking or modular library dependencies to name a few. A complete list of the new features can be found here.

Besides new features, TypeScript 2.0.3 contains many bug fixes. This might result in additional compile time errors when you first compile your project with TypeScript 2.0.3.

JavaScript

The JavaScript in VS Code is powered by TypeScript and the TypeScript version bundled with VS Code has been updated to version 2.0.3.

This brings several improvements for JavaScript support:

In addition, there are improvements to TypeScript that are also applicable to JavaScript:

One very big improvement is that the acquisition of Type Declaration files (typings) has been simplified. You can now use NPM directly to get typings with the @types parameter.

For example to get typings for lodash you can run:

PREVIEW TypeScript JavaScript Grammar

The TypeScript/JavaScript TextMate grammar has been reworked for improved syntax highlighting. This work is currently available as an extension in the marketplace. The plan is to switch to this version during October. Please install this extension now and provide us with feedback.

Updated HTML/Razor/Handlebar Support

Since we made VS Code available, we’ve had the debt item that some languages were implemented inside VS Code directly and they were not implemented as an extension. In the last couple of milestones, we have reduced this debt by extracting the JSON, CSS, LESS, SASS languages into their own extension. In September, we have now done this for HTML and its coupled languages, Razor and Handlebar. These languages are now all implemented using the language server protocol.

This is a major refactoring and as a consequence, some language features have not yet been implemented:

September 2020 (version 1.50)

Update 1.50.1: The update addresses these issues.

Welcome to the September 2020 release of Visual Studio Code. There are a number of updates in this version that we hope you will like, some of the key highlights include:

If you’d like to read these release notes online, go to Updates on code.visualstudio.com.

Join us live at the VS Code team’s livestream on Tuesday, October 13 at 8am Pacific (4pm London), to see a demo of what’s new in this release and ask us questions live.

Insiders: Want to try new features as soon as possible? You can download the nightly Insiders build and try the latest updates as soon as they are available.

macOS: Keychain access moved to a different process

Some changes in this release around how the macOS Keychain is accessed from VS Code will require you to acknowledge the following prompt for keychain access on macOS, even if you’ve previously allowed keychain access:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Details: VS Code previously accessed the macOS keychain from the window process itself, but now accesses it from the main process. As such, for macOS it prompts for approval like a new application is requesting access, because the process is a different one from before.

Accessibility

Settings editor

Back in July, we mentioned in the 1.48 release notes that we were investigating ways to improve the accessibility of the settings editor. After a few months of talking to screen reader users, experimenting, prototyping, and gathering feedback from the community, we are shipping the new experience, which we believe is an improvement for all keyboard-heavy users, whether using a screen reader or not.

In this new interaction model, interacting with the settings list works more like interacting with any other list in VS Code. With focus in the search bar, you can press the down arrow to focus a setting row. Then you can use the arrow keys to move focus around the settings list. To edit a setting, you can press enter to set focus on the control in the setting row.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

If you would like to read more about the motivation and thinking behind this approach, please see GitHub issue #108006.

Workbench

Pinned tabs improvements

Pinned tabs were introduced in our May 2020 release. Since then, we’ve received valuable feedback on how to improve this experience further, and for this milestone there are a couple of changes worth mentioning.

A new setting workbench.editor.pinnedTabSizing allows you to configure how large a pinned tab should appear:

Pinned tabs also show a new «pinned» icon to allow you to unpin with one click. This icon will also appear in the «Open Editors» view.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code installTheme: GitHub Light

Some other improvements include:

Renamed some editor-related context keys

A few new editor context keys have been introduced, deprecating some of the existing ones. If you are using these in your keybinding settings, please update them:

Added new resource (explorer-related) context keys

Two new context keys have been added for resources.

Extensions: Simplified recommendation notifications

In this release, we improved the experience of recommending extensions using notifications by making them smarter and less noisy to users.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Theme: GitHub Sharp Dark

Panel layout improvements

New panel maximization setting

For those who prefer to work with the panel maximized, you no longer have to maximize the panel each time after toggling it open. For those that don’t, the old panel behavior isn’t going away.

Additionally, if the panel is hidden, Toggle Maximized Panel will now always open the panel maximized.

Decreased minimum window width when panel is on the bottom

When the panel is on the bottom rather than on the side, the minimum window width is 400px instead of 600px. This way, developers who want a narrower editor-only or panel-only window can now move the panel to the bottom, optionally hide or maximize it, and then resize the window to the new narrower minimum width.

Linux ARM builds

VS Code is now available for both Linux ARMv7 and ARM64 architectures. This means you can now officially use VS Code on a Raspberry Pi, Chromebook, and other ARM-based devices! On these devices, you can also leverage the VS Code extensions for Remote Development to get access to more powerful development environments when you need them.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Download it now! Also available for Insiders.

Editor

Trigger IntelliSense

Debugging

Debug hover improvements

Language hover now available while debugging

While debugging, the debug hover takes precedence over the language hover, making it impossible to see the language hover. Starting with this release, you can switch from the debug hover back to the language hover by holding down the Alt modifier key. As long as Alt is pressed, the language hover is shown instead of the debug hover. This makes it much easier to read Javadoc while debugging.

Auto sizing debug hover

In order to minimize the need for scrolling, the debug hover width and height now automatically adapts to the size of the hover contents. This not only helps you the full strings, but you can also drill down into object structures, and the hover grows as needed.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Debug console filter improvements

The Debug Console now supports filtering, making it easier for users to find the output they are looking for, or to hide irrelevant logging output. We’ve added a badge to make it clear how many items are filtered away.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

JavaScript debugging

Consolidated auto attach flows

Last month, we introduced new auto attach modes as an experimental feature. This month, they have left the experimental state. The previous debug.autoAttach setting is deprecated in favor of the debug.javascript.autoAttachFilter option. The auto attach badge in the status bar now shows the current mode and allows you to toggle between modes.

Real-time performance view

The flame chart extension will now show a real-time view of performance metrics while debugging JavaScript code. CPU and memory usage are shown for Node.js programs and extension debugging. Debugging Chrome or Edge will additionally show metrics for DOM nodes, relayouts, and restyles.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

In addition to the controls in the view, there are a few settings you can use to control it:

Left-heavy flame chart view

Also new in the flame chart extension is a «left heavy» view, toggled by clicking the button in the upper-right corner of the chart.

This view groups call stacks and orders them by time, creating a visual representation of the «top down» table you might have used in other tools. This is especially useful if your profile has lots of thin call stacks (common with things like web servers) which are hard to get a sense of in the chronological view.

Here we have the same profile opened in the traditional chronological view on the right, and the left-heavy view on the left. With the left-heavy view, it’s much easier to tell exactly where time is being spent.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code installTheme: Codesong

Step through missing code

Previously if you tried to debug a file that has a sourcemap, but for which the source was not available, you would get stuck on a «could not load source» error and would be unable to view the compiled code. We now show a prompt allowing you to ignore the sourcemap and step through compiled code in these cases.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code installTheme: Codesong

Source Control

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Git: Multiple git.path values

You can now specify a list of locations to look for the git executable via the same git.path setting, by using an array of strings.

Source Control view saves input on window reload

Addresses this request to save the Source Control view input on window reload.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Terminal

Search the workspace by selecting text in the terminal

The standard shortcut for searching the workspace ⇧⌘F (Windows, Linux Ctrl+Shift+F ) will now use the terminal’s selection if it’s focused.

Preview features

Preview features are not ready for release but are functional enough to use. We welcome your early feedback while they are under development.

Settings sync

You can now select which settings sync service to use (insiders or stable) while turning on Settings Sync. Note: This option is only available on Insiders.

TypeScript 4.1 beta support

VS Code supports the TypeScript 4.1 beta and nightly builds. The 4.1 update brings some new TypeScript language features, such as support for recursive conditional types, as well as tooling improvements. One focus area has been adding initial support for @see tags in JSDoc comments.

To start using the TypeScript 4.1 nightly builds, just install the TypeScript Nightly extension. Please share feedback and let us know if you run into any bugs with TypeScript 4.1.

Contributions to extensions

GitHub Pull Requests and Issues

Work continues on the GitHub Pull Requests and Issues extension, which allows you to work on, create, and manage pull requests and issues.

To learn about all the new features and updates, you can see the full changelog for the 0.21.0 release of the extension.

Remote Development

Work continues on the Remote Development extensions, which allow you to use a container, remote machine, or the Windows Subsystem for Linux (WSL) as a full-featured development environment.

Feature highlights in 1.50 include:

You can learn about new extension features and bug fixes in the Remote Development release notes.

ESLint

The approval flow to allow the execution of a ESLint library got reworked. The initial experience is now as follows:

The execution of the ESLint library can be denied or approved using the following gestures:

All gestures will open the following dialog:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

The chosen action is then reflected in the ESLint Status Bar item in the following way:

You can manage our decisions using the following commands:

Template string converter

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Docs View

The Docs View extension uses the new Webview View API to show documentation for the symbol at the current cursor position in the sidebar or panel:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Extension authoring

Submenus

The submenu API has been promoted out of proposed state. Extension authors can now define and use submenus across supported menu locations. Check out the syntax as well as the possibilities that this API enables.

Source Control Resource State context value

Asynchronously resolve code action

For code action providers, we have added an optional function ( CodeActionProvider#resolveCodeAction ) which allows you to defer the computation of the actual edits a code action is going to make. This should help reduce the time it takes to provide code actions.

References Viewlet API

The references viewlet now exports an API that allows its content to be defined by other extensions.

New theme colors

Webview Views

The Webview View API allows extensions to contribute webview based views to the sidebar or panel. These views can offer specialized presentations of data, more advanced user interfaces, and much more.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

To get started with webview views, take a look at the webview view extension sample.

Updated Codicons

We’ve added the following new icons to our codicon library:

View title description

The TreeView now has an optional description property which can be used to show less prominent text next to a tree’s title.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Proposed extension APIs

Every milestone comes with new proposed APIs and extension authors can try them out. As always, we want your feedback. This is what you have to do to try out a proposed API:

You cannot publish an extension that uses a proposed API. There may be breaking changes in the next release and we never want to break existing extensions.

Notebook API

The following new and changed APIs are part of the notebooks API proposal:

Comments API

We have added a new property readOnly to CommentThread to allow hiding the reply button in a comment thread.

Debug Adapter Protocol

New invalidated event

A new invalidated event has been added to the protocol. This event signals that some state in the debug adapter has changed and requires that the client (frontend) needs to re-render the data previously requested. Debug adapters do not have to emit the event for runtime changes like «stopped» or thread changes because in these cases the client refetches the new state anyway. However, the event can be used to refresh the UI after rendering formatting has changed in the debug adapter. Debug adapters should only send the event if a true supportsInvalidatedEvent capability was received from the client in the ‘initialize’ request. Mock debug has an example for how to use the event.

Proposal for Conditional Exception support

We are planning to support «Conditional Exceptions» in a future version of VS Code. Since this requires support in the Debug Adapter Protocol (DAP) we’ve prepared a proposal for «Conditional Exception» support. If you are a debug extension author and interested in this DAP protocol addition, we’d appreciate your feedback.

Engineering

Building VS Code with TypeScript 4.1 beta

We now use the TypeScript 4.1 nightly builds to build VS Code. TypeScript 4.1 adds a few new strictness checks, including more strict types for resolve in promises. This improved type checking helped us to identify and fix potential bugs in our code.

Documentation

Updated Create a Dev Container tutorial

We’ve updated the documentation to help you create a development container. The tutorial now clearly walks you through the steps to create a reusable Docker container to match your development environment. You’ll learn how to:

Notable fixes

Partner extensions

Microsoft C++ extension

The Microsoft C/C++ extension is now out of preview and version 1.0 has lots of great features:

And check out this video tutorial for configuring C++ IntelliSense in VS Code.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Microsoft Edge Tools extension

The Microsoft Edge Tools for VS Code extension is out of preview and provides the Microsoft Edge dev tools directly in VS Code. You will be able to see your site’s runtime HTML structure, alter its layout, fix styling issues as well as see your site’s network requests.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

You can read more about this release and the extension’s powerful features in this recent blog post.

Azure Cognitive Search extension

Try out the new Microsoft Azure Cognitive Search extension for working with Azure Cognitive Search. The extension makes it easy to develop and manage your search service directly from VS Code and includes full IntelliSense and a rich set of snippets.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Thank you

Last but certainly not least, a big Thank You to the following people who contributed this month to VS Code:

Contributions to our issue tracking:

Contributions to vscode :

Contributions to vscode-references-view :

Contributions to vscode-vsce :

Contributions to vscode-json-languageservice :

Contributions to vscode-css-languageservice :

Contributions to node-jsonc-parser :

Начало работы с Python для разработки веб-приложений в Windows

Ниже приведено пошаговое руководство по началу работы с Python для веб-разработки в Windows с помощью подсистемы Windows для Linux (WSL).

Настройка среды разработки

При создании веб-приложений мы рекомендуем установить Python на WSL. Многие руководства и инструкции для разработки веб-приложений на Python написаны для пользователей Linux и поэтому они используют средства упаковки и установки на основе Linux. Большинство веб-приложений также развертываются в Linux, поэтому это обеспечит согласованность между рабочими средами и средами разработки.

Если вы используете Python не для разработки веб-приложений, мы рекомендуем установить Python непосредственно в Windows из Microsoft Store. WSL не поддерживает рабочих столов или приложения с графическим пользовательским интерфейсом (например, PyGame, Gnome, KDE и т. д.). В этих случаях установите и используйте Python непосредственно в Windows. Если у вас нет опыта работы в Python, ознакомьтесь с нашим руководством: Get started using Python on Windows for beginners (Приступая к работе с Python в Windows для начинающих). Если вы заинтересованы в автоматизации общих задач в операционной системе, ознакомьтесь с нашим руководством: Начало работы с Python в Windows для создания сценариев и автоматизации В некоторых расширенных сценариях может потребоваться загрузка определенного выпуска Python непосредственно из python.org или установка альтернативы, например Anaconda, Jython, PyPy, WinPython, IronPython и т. д. Мы рекомендуем это только в том случае, если вы более продвинутый программист на Python и у вас есть конкретная причина выбрать альтернативную реализацию.

Установка подсистемы Windows для Linux

WSL позволяет запускать среду командной строки GNU/Linux, интегрированную непосредственно с Windows и вашими любимыми инструментами, такими как Visual Studio Code, Outlook и т. д. Мы обычно рекомендуем использовать WSL 2 для веб-разработки на Python.

Чтобы включить и установить WSL 2, см. документацию по установке WSL. Эти инструкции включают возможность выбора дистрибутива Linux (например, Ubuntu).

Установите новый Терминал Windows из Microsoft Store. В нем вы можете использовать несколько вкладок (для быстрого перехода между несколькими командным строками Linux, командной строкой Windows, PowerShell, Azure CLI и т. д.), создавать пользовательские сочетания клавиш (для открытия и закрытия вкладок, копирования и вставки и т. п.), а также применять функцию поиска и настраивать пользовательские темы (цветовые схемы, стили и размеры шрифтов, а также фоновое изображение, размытие и прозрачность). Подробнее.

Настройка Visual Studio Code

Воспользуйтесь преимуществами IntelliSense, Linting, поддержки отладки, фрагментов кодаи модульного тестирования с помощью VS Code. VS Code хорошо интегрируется с подсистемой Windows для Linux, предоставляя встроенные терминалы для создания комплексного рабочего процесса между редактором кода и командной строкой, в дополнение к поддержке Git для управления версиями с общими командами Git (добавление, фиксация, принудительная отправка, извлечение), встроенными непосредственно в пользовательский интерфейс.

Скачивание и установка VS Code для Windows. VS Code также доступен для Linux, но подсистема Windows для Linux не поддерживает приложения с графическим пользовательским интерфейсом, поэтому нам нужно установить его в Windows. Не волнуйтесь, вы по-прежнему сможете выполнить интеграцию с командной строкой и инструментами Linux с помощью расширения Remote — WSL.

Установите расширение Remote — WSL в VS Code. Это позволит вам использовать WSL в качестве интегрированной среды разработки и обеспечит совместимость и путь к ней. Подробнее.

Создание нового проекта

Давайте создадим новый каталог проекта в файловой системе Linux (Ubuntu), который затем будет работать с приложениями и инструментами Linux с помощью VS Code.

Закройте VS Code и откройте Ubuntu 18.04 (командная строка WSL), перейдя в меню Пуск (нижний левый значок Windows) и введя: «Ubuntu 18.04».

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Установка Python, pip и venv

Создание виртуальной среды

Использование виртуальных сред — рекомендуемая лучшая методика для проектов разработки Python. Создав виртуальную среду, можно изолировать средства проекта и избежать конфликтов версий с инструментами для других проектов. Например, вы можете обслуживать старые веб-проекты, для которых требуется веб-платформа Django 1.2, но тогда новый проект будет сопровождаться Django 2.2. Если вы обновляете Django глобально, за пределами виртуальной среды, позже вы можете столкнуться с некоторыми проблемами управления версиями. В дополнение к предотвращению случайных конфликтов управления версиями, виртуальные среды позволяют устанавливать пакеты и управлять ими без прав администратора.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Открытие окна «WSL —удаленный доступ»

VS Code использует расширение «Удаленный доступ-WSL» (установлено ранее), чтобы использовать подсистему Linux как удаленный сервер. Это позволяет использовать WSL в качестве интегрированной среды разработки. Подробнее.

Из Защитника Windows предупреждение системы безопасности, в котором нужно выбрать «Разрешить доступ». После открытия VS Code вы увидите индикатор «Подключение к удаленному узлу» в нижнем левом углу, сообщающий вам, что вы редактируете на WSL: Ubuntu-18.04.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Закройте терминал Ubuntu. В дальнейшем мы будем использовать терминал WSL, интегрированный в VS Code.

Откройте терминал WSL в VS Code, нажав Ctrl+` (используя символ обратного апострофа) или выбрав Представление>Терминал. После чего откроется командная строка bash (WSL), открытая в папке проекта, путь к которой вы создали в терминале Ubuntu.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Установка расширения Microsoft Python

Для «Удаленный доступ –WSL» потребуется установить все расширения VS Code. Уже установленные локально расширения VS Code не будут доступны автоматически. Подробнее.

Откройте окно расширения VS Code с помощью CTRL+SHIFT+X (или используйте меню, чтобы перейти к Вид>Расширения).

В верхнем поле Поиск расширений в Marketplace, введите: Python.

Найдите расширение Python (ms-python.python) от Microsoft и нажмите зеленую кнопку Установить.

После завершения установки расширения необходимо нажать синюю кнопку Требуется перезагрузка. Это приведет к перезагрузке VS Code и отображению раздела WSL: UBUNTU-18.04 — Установлено в окне расширений VS Code, который указывает на установку расширения Python.

Запуск простой программы Python

Python — это интерпретируемый язык, поддерживающий различные типы интерпретаторов (Python2, Anaconda, PyPy, и т. д.). VS Code должен по умолчанию использоваться интерпретатором, связанным с вашим проектом. Если у вас есть причина для его изменения, выберите интерпретатор, отображаемый в данный момент в синей строке в нижней части окна VS Code, или откройте Палитру команд. (Ctrl+Shift+P) и введите команду Python: Select Interpreter (Python: выбор интерпретатора). На экране появится список установленных интерпретаторов Python. Using Python environments in VS Code(Использование сред Python в VS Code).

Теперь мы создадим и запустим простую программу Python в качестве тестовой и убедимся, что выбрали правильный интерпретатор Python.

Откройте окно проводника VS Code, введя Ctrl+Shift+E (или воспользуйтесь меню для перехода к Представление>Обозреватель).

Откройте встроенный терминал WSL, если он еще не открыт, введя Ctrl+Shift+` и убедитесь, что папка проекта python HelloWorld выбрана.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Вставьте этот код Python в файл test.py, после чего сохраните файл (Ctrl+S):

Чтобы запустить только что созданную программу Python «Hello World», выберите файл test.py в окне обозревателя VS Code, затем щелкните файл правой кнопкой мыши, чтобы открыть меню параметров. Выберите Запустить файл Python в терминале. Или введите python test.py во встроенном окне терминала WSL, чтобы запустить программу «Hello World». Интерпретатор Python выведет «Hello World» в окне терминала.

Поздравляем. Теперь у вас есть все для создания и запуска программ Python! Теперь давайте попробуем создать приложение Hello World с помощью двух наиболее популярных веб-платформ Python: Flask и Django.

Руководство по созданию Hello World на Flask

Flask представляет собой платформу веб-приложений для Python. В этом кратком руководстве вы создадите небольшое приложение «Hello World» Flask с помощью VS Code и WSL.

Откройте Ubuntu 18.04 (командная строка WSL), перейдя в меню Пуск (левый нижний значок Windows) и напечатав: «Ubuntu 18.04».

Откройте встроенный терминал WSL (bash) в VS Code, введя Ctrl+Shift+` (папка проекта HelloWorld-Flask уже должна быть выбрана). Закройте командную строку Ubuntu, поскольку двигаясь вперед мы будем работать в терминале WSL, интегрированном с VS Code

Создайте новый файл для кода Python: touch app.py

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Добавьте код в app.py, чтобы импортировать Flask и создать экземпляр объекта Flask:

Кроме того, добавьте в app.py функцию, которая возвращает содержимое, в данном случае — простую строку. Используйте декоратор app.route Flask, чтобы сопоставить маршрут URL-адреса «/» с этой функцией:

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

Сохраните файл app.py (CTRL+S).

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

Это приведет к запуску сервера разработки Flask. Сервер разработки ищет app.py по умолчанию. При запуске Flask вы должны увидеть результат, аналогичный приведенному ниже.

Откройте веб-браузер по умолчанию на преобразованной для просмотра странице, Ctrl+щелчок URL-адреса http://127.0.0.1:5000/ в окне терминала. В браузере должно появиться следующее сообщение:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Обратите внимание, что при посещении URL-адреса, например «/», в терминале отладки появится сообщение, показывающее HTTP-запрос:

Закройте приложение, используя в окне терминала команду CTRL+C.

Если вы хотите использовать имя файла, отличное от app.py, например program.py, определите переменную среды с именем FLASK_APP и установите ее значение для выбранного файла. Сервер разработки Flask использует значение FLASK_APP вместо файла по умолчанию app.py. Дополнительные сведения см. в документации по интерфейсу командной строки Flask.

Поздравляем, вы создали веб-приложение Flask с помощью Visual Studio Code и подсистемы Windows для Linux! Более подробное руководство по использованию VS Code и Flask см. в разделе Руководство по Flask в Visual Studio Code.

Руководство по созданию Hello World на Django

Django представляет собой платформу веб-приложений для Python. В этом кратком руководстве вы создадите небольшое приложение «Hello World» Django с помощью VS Code и WSL.

Откройте Ubuntu 18.04 (командная строка WSL), перейдя в меню Пуск (левый нижний значок Windows) и напечатав: «Ubuntu 18.04».

Откройте встроенный терминал WSL (bash) в VS Code, введя Ctrl+Shift+` (папка проекта HelloWorld-Django уже должна быть выбрана). Закройте командную строку Ubuntu, поскольку двигаясь вперед мы будем работать в терминале WSL, интегрированном с VS Code

Затем выполните следующую команду, чтобы создать проект Django:

Ctrl+click URL-адрес http://127.0.0.1:8000/ в окне вывода терминала, чтобы открыть для этого адреса браузер по умолчанию. Если Django установлен правильно и проект является допустимым, вы увидите страницу по умолчанию. В окне вывода терминала VS Code также отображается журнал сервера.

Теперь, чтобы создать приложение Django, запустите административную команду служебной программы startapp в папке проекта (где находится manage.py ):

Измените hello/views.py в соответствии с приведенным ниже кодом, который создает одно представление для домашней страницы приложения:

Сохраните все измененные файлы.

Поздравляем, вы создали веб-приложение Django с помощью VS Code и подсистемы Windows для Linux! Более подробное руководство по использованию VS Code и Django см. в разделе Руководство по Django в Visual Studio Code.

How To Install and Use the Visual Studio Code (VS Code) Command Line Interface

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Introduction

Visual Studio Code is a free, open-source, and cross-platform text editor developed primarily by Microsoft. It uses web technologies such as JavaScript and CSS, which has helped facilitate a large ecosystem of community-created plugins to extend its functionality into many different programming languages and features.

In this tutorial, you’ll install the Visual Studio Code command line interface and learn how to use it to open files and directories, compare changes between files, and install extensions.

Prerequisites

To complete this tutorial, you’ll need to have Visual Studio Code installed. Please refer to the official Setting up Visual Studio Code documentation to find out how to install Code for your platform.

Installing the Visual Studio Code Command Line Interface

You may need to install the Visual Studio Code command line interface before using it. To do so, first launch the normal Visual Studio Code graphical interface. If this is your first time opening the app, the default screen will have a icon bar along the left, and a default welcome tab:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Visual Studio Code provides a built-in command to install its command line interface. Bring up Code’s Command Palette by typing Command+Shift+P on Mac, or Control+Shift+P on Windows and Linux:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install‘ prompt»>

This will open a prompt near the top of your Code window. Type shell command into the prompt. It should autocomplete to the correct command which will read Shell Command: Install ‘code’ command in PATH :

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Press ENTER to run the highlighted command. You may be prompted to enter your administrator credentials to finish the installation process.

You now have the code command line command installed.

If your output includes a version string, you’ve successfully installed the Visual Studio Code command line interface. The next few sections will show you a few ways to use it.

Opening Files with the code Command

Running the code command with one or more filenames will open those files in the Visual Studio Code GUI:

This will open the file1 file in Code.

Opening a Directory with the code Command

Use the code command followed by one or more directory names to open the directories in a new Visual Studio Code window:

Opening a workspace file with the code command works similar to opening directories:

Installing an Extension Using the code Command

You can install Visual Studio Code extensions using the code command line tool as well. To do so, you’ll first need to know the extension’s unique identifier. To find this information, first navigate to the extension’s page on the Visual Studio Marketplace.

For instance, here is the page for the Jupyter Notebook extension:

You can also find this information on the Marketplace page itself, towards the bottom of the right-hand column in the More info section:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Showing the Differences Between Two Files Using the code Command

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Piping stdin Into Visual Studio Code Using the code Command

An important feature of most command line shells is the ability to pipe (or send) the output of one command to the input of the next. In the following command line, notice the | pipe character connecting the ls

This will execute the ls command on the

code will output some information about the temporary file that it has created to hold the input:

Then this file will open up in the Code GUI interface:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

This command will continue to wait indefinitely for more input. Press CTRL+C to have code stop listening and return you to your shell.

Conclusion

In this tutorial you installed Visual Studio Code’s code command line tool, and used it to open files and directories, compare files, and install extensions.

You can also refer to the official Visual Studio Code command line documentation or take a look at our VS Code tag page for more Visual Studio Code tutorials, tech talks, and Q&A.

Want to learn more? Join the DigitalOcean Community!

Join our DigitalOcean community of over a million developers for free! Get help and share knowledge in our Questions & Answers section, find tutorials and tools that will help you grow as a developer and scale your project or business, and subscribe to topics of interest.

Code editing. Redefined.

Free. Built on open source. Runs everywhere.

By using VS Code, you agree to its license and privacy statement.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Meet IntelliSense.

Go beyond syntax highlighting and autocomplete with IntelliSense, which provides smart completions based on variable types, function definitions, and imported modules.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Print statement debugging is a thing of the past.

Debug code right from the editor. Launch or attach to your running apps and debug with break points, call stacks, and an interactive console.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Git commands built-in.

Working with Git and other SCM providers has never been easier. Review diffs, stage files, and make commits right from the editor. Push and pull from any hosted SCM service.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Extensible and customizable.

Want even more features? Install extensions to add new languages, themes, debuggers, and to connect to additional services. Extensions run in separate processes, ensuring they won’t slow down your editor. Learn more about extensions.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Deploy with confidence and ease

With Microsoft Azure you can deploy and host your React, Angular, Vue, Node, Python (and more!) sites, store and query relational and document based data, and scale with serverless computing, all with ease, all from within VS Code.

VS Code for

Want new features sooner?

Use vscode.dev for quick edits online!

GitHub, Azure Repos, and local files.

License and Privacy Terms

By downloading and using Visual Studio Code, you agree to the license terms and privacy statement. VS Code automatically sends telemetry data and crash dumps to help us improve the product. If you would prefer not to have this data sent please go see How to Disable Crash Reporting to learn how to disable it.

November 2018 (version 1.30)

Update 1.30.2: The update addresses these issues.

Update 1.30.1: The update addresses these issues.

Downloads: Windows: User System | Mac: 64 bit | Linux 64-bit: deb rpm tarball | 32-bit: deb rpm tarball

Welcome to the November 2018 release of Visual Studio Code. There are a number of significant updates in this version that we hope you will like, some of the key highlights include:

If you’d like to read these release notes online, go to Updates on code.visualstudio.com.

The release notes are arranged in the following sections related to VS Code focus areas. Here are some further updates:

Insiders: Want to see new features as soon as possible? You can download the nightly Insiders build and try the latest updates as soon as they are available. And for the latest Visual Studio Code news, updates, and content, follow us on Twitter @code!

Workbench

Multiline search input

Last month, we added support for multiline search. This month we improved the search UX to make it easier to use. Now, you can search with multiline text without having to write a regular expression. Type Shift+Enter in the search box to insert a newline, and the search box will grow to show your full multiline query. You can also copy and paste a multiline selection from the editor into the search box.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Custom title and menu bar on Linux by default

Over several releases, we have been improving the accessibility and themability of menus on Windows via the custom title and menu bar. While it was optionally available on Linux, in this release it will now be enabled by default.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Scrolling menus

With the custom menu bar enabled, menus are restricted to being rendered within the VS Code window. Previously, menus could be cut off by the boundaries of the window. This has now been address by making context menus scrollable when needed.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Menu bar overflow menu

The menu bar also has a new overflow menu (. ) when your window width is not enough for both the menu bar and your window title.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Moved Settings editor actions

The Settings editor actions (Open settings.json, Show modified settings, etc.) have been moved from the . menu inside the Settings editor to the editor title bar. This makes them consistent with other editor types, and Open settings.json is now just one click away with the curly braces <> button. The Keyboard Shortcuts editor has made the same change.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

References view

The References view has been polished and is no longer a preview feature. There are now two commands:

The References view is hidden at startup but will remain visible once it has been used. If all search results are cleared, it shows a history of previous searches.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

There is now a results summary at the top of the view and a context menu to clear and copy results. Many bugs were fixed and the overall stability has been improved.

Editor

Snippet comment variables

There are new snippet variables that insert line or block comments, honoring the current language. Use BLOCK_COMMENT_START and BLOCK_COMMENT_END for block comments and LINE_COMMENT otherwise.

The snippet below inserts /* Hello World */ in JavaScript files and in HTML files

Declaration versus definition

Until now, VS Code offered commands for displaying the definition of a symbol, for example Go to Definition and Peek Definition. This didn’t take into account the fact that some languages differentiate, stricter than others, between the declaration and the definition of a symbol. We have fixed that and there are now commands Go to Declaration and Peek Declaration for the declaration of a symbol.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

The data required for language features like Go to Declaration is computed by extensions and there is a new API, which you can read about in the Extension Authoring section.

Smooth cursor animation

Git integration

Change default click action

Push or sync on commit

Languages

TypeScript 3.2

Improved display of JavaScript and TypeScript callbacks

JavaScript and TypeScript anonymous callbacks were all previously labeled as in the Outline view, breadcrumbs view, and document symbol list. This made it impossible to tell which function you were really after:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

With TypeScript 3.2+, VS Code now displays more context for callback functions so that you can tell them apart:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Renames handle JS/TS destructuring properly

Renames now handle JavaScript and TypeScript destructuring and will introduce an alias if needed:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Adding missing new JS/TS Quick Fix

Forget a new when instantiating a class? TypeScript 3.2 brings a new Quick Fix to help out:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

This Quick Fix works in TypeScript and in type checked JavaScript.

File icons for JS/TS path suggestions

Building on work in VS Code 1.29, the IntelliSense widget now shows file icons for JavaScript and TypeScript path suggestions:

Highlighting of Markdown elements in JSDoc comments

Fenced code blocks and other Markdown elements inside of JSDoc blocks are now syntax highlighted:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

This inline highlighting better matches VS Code’s Markdown rendering of JSDoc for hovers and IntelliSense documentation.

Debugging

Simplified initial debug configuration

Debug consoles can be deleted

As of last milestone when debugging multiple debug sessions, we show multiple debug consoles, one for each session. Now it is possible to delete these consoles when the corresponding session is no longer active by clearing the content of that debug console. We did not add explicit commands for managing the lifecycle of a debug console, because we believe the current approach will be more intuitive and easier to use.

Improved user input variables for debug configurations

We have improved and generalized the concept of launch.json variables that prompt for user input. You can find the details in the Tasks section.

Debugging from the Process Explorer

It’s now possible to start debugging Node.js processes from the VS Code Process Explorer (Developer: Open Process Explorer) using the Debug context menu action.

Below you can see attaching to a Node.js process started from the Integrated Terminal.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Node/Chrome debugging

smartStep now enabled by default

A few releases ago, we changed the behavior of smartStep to make it more useful. Using smartStep results in a much better debugging experience, especially for TypeScript, so we have changed the behavior to be always on.

Automatic default for localRoot

Tasks

Run on folder open

Clear task terminal

Rerun tasks

Tasks can now be rerun using the Tasks: Rerun Last Task command ( workbench.action.tasks.reRunTask ). By default, a rerun task will re-evaluate its run variables, including its inputs. To use the variables that have already been evaluated in the previous run, configure the «reevaluateOnRerun» option:

Improved user input variables for task and debug configurations

Example using Angular CLI:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Here is the list of supported attributes:

A first example shows how to use a user input variable in a task configuration ( tasks.json ):

Another example shows a user input variable for selecting between two options in a debug configuration ( launch.json ):

We plan to combine user input variables with the existing command-based variables so that user input variables can be contributed by extensions.

Extensions

Install previous versions

You can now go back to a previous version of an extension if there are issues with the current version. VS Code provides an Install Another Version action on an installed extension which shows a dropdown of available versions.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Unresponsive extension host

VS Code runs extensions in a separate Node.js process – the extension host. This isolates extension code from VS Code itself, but it doesn’t isolate different extensions from each other. Due to the single threaded nature of JavaScript, an extension can, willingly or not, monopolize the extension host thread, block all other extensions, and make operations appear unresponsive.

VS Code now monitors the extension host and when it becomes unresponsive, VS Code starts profiling the extension host. When an extension is identified as being the cause of the unresponsiveness, a minimized notification is shown that encourages the user to file an issue:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

As a user, keep an eye on the bell icon in the Status Bar as the notification is small. As an extension author, if you receive an unresponsive issue, please review this guide which explains what has happened and how to open the CPU-profile attached to the issue.

Preview Features

Preview features are not ready for release but are functional enough to use. We welcome your early feedback while they are under development.

HTML custom tags / attributes support

The new html.experimental.custom.tags and html.experimental.custom.attributes settings allows you to specify a list of tags and attributes that VS Code loads during startup. When you are editing HTML files, VS Code will offer auto-completion and hover for those tags and attributes. This works great with Web Components, for example:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

You can open octref/web-components-examples repository to test this feature. This feature is in preview and both the setting names and JSON format are subject to change.

If you have feedback or feature requests, please follow up in issue #62976.

Network proxy support for extensions

There is an experimental setting Http: Proxy Support for enabling network proxy support for all extensions. While we are still working on some of the details, we invite you to give it a try and let us know if it works for you. (Note that enabling the network proxy support currently breaks the GitHub Pull-Request extension’s sign-in.)

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Setting it to override should work best for most setups, try on for comparison when that doesn’t work well.

Extension Authoring

Go To Declaration

We have added a DeclarationProvider interface which extensions can implement to support the Go to Declaration feature. Declaration providers should return locations that are the declaration of a symbol. When multiple providers are registered for the same file, then their results are merged.

Signature Help Context

SignatureHelpProviders now take a context parameter that provides information about how signature help was triggered. The context includes:

Additionally, SignatureHelpProviders can now be registered with a distinct set of trigger characters and re-trigger characters. Re-trigger characters only trigger signature help if is already showing.

Here’s the above SignatureHelpProvider in action:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Configuring contributed TypeScript server plugins

Extensions can now send configuration data to contributed typescript server plugins through an API provided by VS Code’s built-in TypeScript extension:

The TypeScript server plugin receives the configuration data through an onConfigurationChanged method:

This API allows VS Code extensions to synchronize VS Code settings with a TypeScript server plugin, or dynamically change the behavior of a plugin. Take a look at the TypeScript TSLint plugin and lit-html extensions to see how this API is used in practice.

Custom views

The proposed API for adding a Collapse All action to your view is now stable.

Tree Item Description

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Debugging API

Richer DebugSession

The DebugSession API now surfaces the workspace folder and the resolved debug configuration. Resolved means that all variables have been substituted and platform specific attribute sections have been «flattened» for the matching platform and removed for non-matching platforms.

Unique ID for breakpoints

The Breakpoint class now surfaces a unique ID ( id ) that doesn’t change over its entire lifetime.

Finalized API for controlling debug adapter creation

This snippet shows how this API can be used to run a debug adapter embedded in its containing extension:

Finalized Debug Adapter Tracker API

This snippet shows how this API can be used to log the Debug Adapter Protocol for the Node.js debugger:

Debug Adapter Protocol

New shellProcessId attribute for runInTerminal response

If a debug adapter needs to run a target in a terminal, it can use the DAP runInTerminal request. This request can optionally return the processId of the target process but in practice no frontend implementation has been able to supply this information. For this reason, we have introduced a new attribute shellProcessId for returning the process ID of the terminal shell (which is much simpler to determine).

Clipboard

The clipboard API has been finalized and can now be used by all extensions. It allows extensions to copy and paste strings to the OS clipboard.

Completion items

When inserting a completion item that spans multiple lines, VS Code adjusts the indentation. This is not always wanted and therefore we added vscode.CompletionItem.keepWhitespace to control this behavior.

Labels for symbol providers

When registering a document symbol provider, a label ( DocumentSymbolProviderMetadata ) can now be provided. This label will be shown in breadcrumbs and the Outline view when a document has multiple symbol providers.

Proposed Extension APIs

Every milestone comes with new proposed APIs and extension authors can try them out. As always we are keen on your feedback. This is what you have to do to try out a proposed API:

Note that you cannot publish an extension that uses a proposed API. We may likely make breaking changes in the next release and we never want to break existing extensions.

Custom views support message text

Tree view message

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Smart select and extensions

Engineering

WinJS-Promise removal

500 are instantiations and not plain type annotation. We are confident we will finish this epic journey soon!

Continued Electron 3.0 exploration

During this milestone, we continued to explore bundling Electron 3.0.0 into VS Code. This is a major Electron release and comes with Chrome 66 and Node.js 10.x (a major leap forward compared to our current version that has Chrome 61 and Node.js 8.x). We plan to push out the update to our Insiders users in December to gather additional feedback. If you are interested in helping out, make sure to install VS Code Insiders.

Community issue tracking

The community has helped us out periodically with issue tracking for a very long time. As we see more and more issues being filed (currently at an average of 70 per day), we have started to invite the community members that are most active to add specific labels to the issues they are working on. Since GitHub doesn’t have fine-grained permissions, we are using our issue bot to pick up on certain comments and add the labels for them. See the Thank you section below for acknowledgments.

Strict Null Checking

Our work to strict null check the main VS Code codebase has continued. We are now strict null checking around 800 files, and will continuing with this work until the entire codebase is covered.

You can track this engineering effort and learn more about the process issue #60565.

Contributions to Extensions

Our team maintains or contributes to a number of VS Code extensions. Most notably this month:

GitHub Pull Requests

This milestone we worked on improvements to the GitHub Pull Requests extension.

Below are some of the new features:

You can read the full release notes for the extension at vscode-pull-request-github releases.

New Documentation

Vue.js and Ember.js tutorials

There are two new tutorials showing how to use VS Code with these popular JavaScript frameworks.

Notable fixes

Thank you

Last but certainly not least, a big Thank You! to the following folks that helped to make VS Code even better:

Contributions to our issue tracking:

Contributions to vscode :

Contributions to vscode-vsce :

Contributions to vscode-eslint :

Contributions to language-server-protocol :

Contributions to vscode-languageserver-node :

Contributions to vscode-html-languageservice :

Contributions to vscode-generator-code :

Contributions to debug-adapter-protocol :

Contributions to vscode-chrome-debug-core :

Contributions to vscode-chrome-debug :

Contributions to vscode-azure-account :

Contributions to vscode-recipes :

Contributions to localization :

There are almost 1400 members in the Transifex VS Code project team with about 100 active contributors every month. We appreciate your contributions, either by providing new translations, voting on translations, or suggesting process improvements.

VSCodium/vscodium

Use Git or checkout with SVN using the web URL.

Work fast with our official CLI. Learn more.

Launching GitHub Desktop

If nothing happens, download GitHub Desktop and try again.

Launching GitHub Desktop

If nothing happens, download GitHub Desktop and try again.

Launching Xcode

If nothing happens, download Xcode and try again.

Launching Visual Studio Code

Your codespace will open once ready.

There was a problem preparing your codespace, please try again.

Latest commit

Git stats

Files

Failed to load latest commit information.

README.md

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Free/Libre Open Source Software Binaries of VS Code

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

This is not a fork. This is a repository of scripts to automatically build Microsoft’s vscode repository into freely-licensed binaries with a community-driven default configuration.

Table of Contents

Install with Brew (Mac)

If you are on a Mac and have Homebrew installed:

Note for macOS users: if you can’t open the App, please read the following troubleshooting.

Install with Windows Package Manager (WinGet)

If you use Windows and have Windows Package Manager installed:

Install with Chocolatey (Windows)

If you use Windows and have Chocolatey installed (thanks to @Thilas):

Install with Scoop (Windows)

If you use Windows and have Scoop installed:

Install with snap (GNU/Linux)

VSCodium is available in the Snap Store as Codium, thanks to the help of the Snapcrafters community. If your GNU/Linux distribution has support for snaps:

Install with Package Manager (GNU/Linux)

You can always install using the downloads (deb, rpm, tar) on the releases page, but you can also install using your favorite package manager and get automatic updates. @paulcarroty has set up a repository with instructions here. Any issues installing VSCodium using your package manager should be directed to that repository’s issue tracker.

Install on Arch Linux

VSCodium is available in AUR as package vscodium-bin, maintained by @binex-dsk. An alternative package vscodium-git, maintained by @cedricroijakkers, is also available should you wish to compile from source yourself.

Flatpak Option (GNU/Linux)

VSCodium is (unofficially) available as a Flatpak app here and the build repo is here. If your distribution has support for flatpak, and you have enabled the flathub repo:

Build instructions can be found here

Why Does This Exist

This repository contains build files to generate free release binaries of Microsoft’s VS Code. When we speak of «free software», we’re talking about freedom, not price.

Microsoft’s releases of Visual Studio Code are licensed under this not-FLOSS license and contain telemetry/tracking. According to this comment from a Visual Studio Code maintainer:

When we [Microsoft] build Visual Studio Code, we do exactly this. We clone the vscode repository, we lay down a customized product.json that has Microsoft specific functionality (telemetry, gallery, logo, etc.), and then produce a build that we release under our license.

When you clone and build from the vscode repo, none of these endpoints are configured in the default product.json. Therefore, you generate a «clean» build, without the Microsoft customizations, which is by default licensed under the MIT license

This repo exists so that you don’t have to download+build from source. The build scripts in this repo clone Microsoft’s vscode repo, run the build commands, and upload the resulting binaries to GitHub releases. These binaries are licensed under the MIT license. Telemetry is disabled.

If you want to build from source yourself, head over to Microsoft’s vscode repo and follow their instructions. This repo exists to make it easier to get the latest version of MIT-licensed VS Code.

Microsoft’s build process (which we are running to build the binaries) does download additional files. This was brought up in Microsoft/vscode#141340 and Microsoft/vscode#45978. These are the packages downloaded during build:

For more information on getting all the telemetry disabled and tips for migrating from Visual Studio Code to VSCodium, have a look at this Docs page.

Extensions and the Marketplace

According to the VS Code Marketplace Terms of Use, you may only install and use Marketplace Offerings with Visual Studio Products and Services. For this reason, VSCodium uses open-vsx.org, an open source registry for VS Code extensions. See the Extensions + Marketplace section on the Docs page for more details.

Please note that some Visual Studio Code extensions have licenses that restrict their use to the official Visual Studio Code builds and therefore do not work with VSCodium. See this note on the Docs page for what’s been found so far and possible workarounds.

How are the VSCodium binaries built?

The builds are run every day, but exit early if there isn’t a new release from Microsoft.

The minimal version is limited by the core component Electron, you may want to check its platform prerequisites.

Setting up Visual Studio Code

Getting up and running with Visual Studio Code is quick and easy. It is a small download so you can install in a matter of minutes and give VS Code a try.

Cross platform

VS Code is a free code editor, which runs on the macOS, Linux, and Windows operating systems.

Follow the platform-specific guides below:

VS Code is lightweight and should run on most available hardware and platform versions. You can review the System Requirements to check if your computer configuration is supported.

Update cadence

VS Code releases a new version each month with new features and important bug fixes. Most platforms support auto updating and you will be prompted to install the new release when it becomes available. You can also manually check for updates by running Help > Check for Updates on Linux and Windows or running Code > Check for Updates on macOS.

Note: You can disable auto-update if you prefer to update VS Code on your own schedule.

Insiders nightly build

If you’d like to try our nightly builds to see new features early or verify bug fixes, you can install our Insiders build. The Insiders build installs side-by-side with the monthly Stable build and you can freely work with either on the same machine. The Insiders build is the same one the VS Code development team uses on a daily basis and we really appreciate people trying out new features and providing feedback.

Portable mode

Visual Studio Code supports Portable mode installation. This mode enables all data created and maintained by VS Code to live near itself, so it can be moved around across environments, for example, on a USB drive. See the VS Code Portable Mode documentation for details.

Additional components

VS Code is an editor, first and foremost, and prides itself on a small footprint. Unlike traditional IDEs that tend to include everything but the kitchen sink, you can tune your installation to the development technologies you care about. Be sure to read the Additional Components topic after reading the platform guides to learn about customizing your VS Code installation.

Extensions

VS Code extensions let third parties add support for additional:

Extensions integrate into VS Code’s UI, commands, and task running systems so you’ll find it easy to work with different technologies through VS Code’s shared interface. Check out the VS Code extension Marketplace to see what’s available.

Next steps

Once you have installed and set up VS Code, these topics will help you learn more about VS Code:

If you’d like to get something running quickly, try the Node.js tutorial walkthrough that will have you debugging a Node.js web application with VS Code in minutes.

Common questions

What are the system requirements for VS Code?

How big is VS Code?

VS Code is a small download ( New Project dialog or pre-installed project templates. You’ll need to add additional components and scaffolders depending on your development interests. With scaffolding tools like Yeoman and the multitude of modules available through the npm package manager, you’re sure to find appropriate templates and tools to create your projects.

How do I know which version I’m running?

On Linux and Windows, choose Help > About. On macOS, use Code > About Visual Studio Code.

Why is VS Code saying my installation is Unsupported?

VS Code has detected that some installation files have been modified, perhaps by an extension. Reinstalling VS Code will replace the affected files. See our FAQ topic for more details.

How can I do a ‘clean’ uninstall of VS Code?

The folder locations will vary depending on your platform:

Use command-line parameters to install, update, and manage Visual Studio

When you install Visual Studio programmatically or from a command prompt, you can use various command-line parameters to control or customize the installation to perform the following actions:

The command-line options described below can either be used with the setup bootstrapper, which is the small (

1 MB) file (for example, vs_enterprise.exe) that initiates the download process, or with the installer. All of the commands and parameters listed below are designed to work with the bootstrappers unless it’s explicitly specified to be installer only. Note that client machines may only have the installer available for programmatic execution if Visual Studio was installed via a layout.

It is also possible to use the Administrator Update package, which is available to download from the Microsoft Update Catalog, to programatically update your network layout. More information how to do this can be found in the Update or modify your layout documentation.

You can get the Visual Studio 2019 bootstrappers from the table below. Alternatively, if you want a specific version of Visual Studio 2019, you can go to the Visual Studio 2019 Releases page, which has links to the fixed version bootstrappers for your chosen version and edition of Visual Studio.

EditionBootstrapper
Visual Studio 2019 Enterprise version 16.11vs_enterprise.exe
Visual Studio 2019 Professional version 16.11vs_professional.exe
Visual Studio 2019 Build Tools version 16.11vs_buildtools.exe

To get the latest bootstrappers for Visual Studio 2022 that will always install the latest version of the Current channel, download one of the files below. Alternatively, if you want to install a specific version or a specific channel of Visual Studio 2022, go to the Visual Studio 2022 Release History page, which has links to the fixed version bootstrappers for each servicing release.

EditionBootstrapper
Visual Studio 2022 Enterprisevs_enterprise.exe
Visual Studio 2022 Professionalvs_professional.exe
Visual Studio 2022 Communityvs_community.exe
Visual Studio 2022 Build Toolsvs_buildtools.exe

If you previously downloaded a bootstrapper file and want to verify its version, here’s how. In Windows, open File Explorer, right-click the bootstrapper file, choose Properties, choose the Details tab, and then view the Product version number. To match that number to a release of Visual Studio, refer to the table at the bottom of the Visual Studio 2019 Releases page.

If you previously downloaded a bootstrapper file and want to verify what version it will install, here’s how. In Windows, open File Explorer, right-click the bootstrapper file, choose Properties and then choose the Details tab. The Product version field will describe the channel and version that the bootstrapper will install. The version number should always be read as «latest servicing version of what is specified», and the channel is Current unless explicitly specified. So, a bootstrapper with a Product version of LTSC 17.0 will install the latest 17.0.x servicing release that is available on the 17.0 LTSC channel. A bootstrapper with a Product version that simply says Visual Studio 2022 will install the latest version of Visual Studio 2022 on the Current channel.

Install, Update, Modify, Repair, Uninstall, and Export commands and command-line parameters

When invoking the Visual Studio bootstrapper or the installer programmatically to install the product or to maintain a layout, the first parameter is the command (the verb) that describes the operation to perform. The subsequent optional command line parameters, which are all prefixed by two dashes (—), further define how that operation is supposed to happen. All Visual Studio command-line parameters are case-insensitive, and additional examples can be found on the Command-line parameter examples page.

Optional: During an install or modify operation, this determines the workloads and components to add based on a previously saved installation configuration file. This operation is additive and it won’t remove any workload or component if they aren’t present in the file. Also, items that don’t apply to the product won’t be added. During an export operation, this determines the location to save the installation configuration file.

Layout command and command-line parameters

Important: This switch doesn’t stop Visual Studio setup from checking for updates. For more information, see Control updates to network-based Visual Studio deployments.—path =

Optional: Used to specify custom install paths for the installation. Supported path names are shared, cache, and install.—path cache=

Important: This can be set only once and on the first time that Visual Studio is installed.—path install=

Configure source location of updates command and command-line parameters

You can programmatically configure the source location of updates for a given instance of Visual Studio by using either the installer or the bootstrapper on the client machine, and passing in the desired update channel.

Administrator Update command and command-line parameters

You can download an Administrator Update from the Microsoft Update Catalog and use it to update either your client installation or your layout.

On the client, if you download the Administrator Update into your installation directory on your client machine, you can just double-click on the file to apply the update. You can also open a command window and pass some of the parameters below to change the default behavior.

If you are deploying the administrator update through Microsoft Endpoint Manager (SCCM), you can modify the package to adjust the behavior by using the parameters below. You can also control the parameters via a configuration file on the client machine. For more information, refer to Methods for configuring an administrator update

Note that all Administrator Update parameters are default run in the «update» context unless the layout verb is specified.

Administrator update parametersDescription
—installerUpdateArgs [optional parameters]This parameter functions as a «pass-through array» of specific parameters that are relevant to administrator update scenarios. Optional parameters that are enabled for this purpose are:

List of workload IDs and component IDs

For a list of workload and component IDs sorted by Visual Studio product, see the Visual Studio workload and component IDs page.

List of language locales

Error codes

Depending on the result of the operation, the %ERRORLEVEL% environment variable is set to one of the following values:

Support or troubleshooting

Sometimes, things can go wrong. If your Visual Studio installation fails, see Troubleshoot Visual Studio installation and upgrade issues for step-by-step guidance.

Here are a few more support options:

June 2018 (version 1.25)

Update 1.25.1: The update addresses these issues.

Downloads: Windows: System | Mac: 64 bit | Linux 64-bit: deb rpm tarball | 32-bit: deb rpm tarball

Welcome to the June 2018 release of Visual Studio Code. We’re very excited to move several features announced as Preview last month to Stable. Some of the key highlights include:

If you’d like to read these release notes online, go to Updates on code.visualstudio.com.
You can also check out this 1.25 release highlights video from Cloud Developer Advocate Brian Clark.

The release notes are arranged in the following sections related to VS Code focus areas. Here are some further updates:

Insiders: Want to see new features as soon as possible? You can download the nightly Insiders build and try the latest updates as soon as they are available. And for the latest Visual Studio Code news, updates, and content, follow us on Twitter @code!

Workbench

Grid editor layout

You can now arrange editors both vertically and horizontally and have more than 3 editors side by side:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

There are a predefined set of editor layouts in the new View > Editor Layout menu:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

There are many new commands for adjusting the editor layout with the keyboard alone, but if you prefer to use the mouse, drag and drop is a fast way to split the editor in any direction:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Since editor groups are now unlimited and can be arranged in many ways, the OPEN EDITORS view no longer labels editor groups as Left, Center, or Right. Instead, editor groups are now labeled with numbers according to their creation time. The last editor group created will always be at the end of the OPEN EDITORS list. We found this to be a good model that minimizes changing the list when moving editor groups around in the layout:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Refer to the Extension Authoring section for the impact on extensions and themes and see New Commands for the list of new grid editor layout commands.

Pro Tip: If you press and hold the Alt key while hovering over the toolbar action to split an editor, it will offer to split to the other orientation. This is a fast way to split either to the right or to the bottom.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Due to the grid layout work we have changed how the centered editor layout behaves:

Outline view

The Outline view is out of preview and now enabled by default. It is a separate section in the bottom of the File Explorer. When expanded, it will show the symbol tree of the currently active editor.

The Outline view has different Sort By modes, optional cursor tracking, and supports the usual open gestures. It also includes an input box which finds or filters symbols as you type. Errors and warnings are also shown in the Outline view, letting you see at a glance a problem’s location.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

There are several Outline view settings which allow you to enable/disable icons and control the errors and warnings display (all enabled by default):

There is also a new API for extensions authors.

Portable Mode

VS Code now supports Portable Mode, where all data created and maintained by VS Code is located near the installation. This lets you easily move a VS Code setup across environments, for example through a USB drive or file share. Portable Mode is supported on the ZIP download for Windows and Linux, as well as the regular Application download for macOS. Click here to learn more.

Drop files and folders into empty files explorer

It is now possible to drop files, folders, and VS Code workspace files into an empty Explorer to open them.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

History navigation

Navigating input history is now more natural and consistent across VS Code. You can use the UpArrow ( history.showPrevious ) and DownArrow ( history.showNext ) keys to navigate the input boxes in the Search and Problems views and the Find widgets in the Editor, Terminal, and Web views.

Editor

Hover display options

Some users prefer to have no hover suggestions covering text in the editor and the editor hover can now be customized with three additional settings. Use editor.hover.enabled to toggle the editor hover, use editor.hover.delay to customize the time until the hover is shown, and use editor.hover.sticky to change if the hover should remain visible when moving the mouse over it.

Sub-word support

We have new commands for sub-word navigation and sub-word deletion. These commands will stop at camel case positions and at underscores ( _ ).

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Here is an example for how you can bind them:

Suggestion selections

Language IntelliSense providers often know which suggestions are best and with this version of VS Code, they can now preselect suggestions. There is new API for preselected suggestions and when available, the editor will select that suggestion rather than the first in the list.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Snippet placeholder transformations

Snippets finally support placeholder transformations. Placeholder transformations are like variable transformations but more dynamic. A transformation is applied when switching from one placeholder to the next and this is the grammar rule for them: $<int/regex/format_string/opts>.

Below is a sample that replaces «Hello World» with its German counterpart:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Refer to the snippet grammar for more details and how to unleash the full potential of transformations.

Integrated Terminal

Performance Improvements

The Integrated Terminal’s parser was re-written from the ground up for enhanced ANSI compliance and boosting the rate at which incoming data is processed by approximately 30%. This came in as an upstream community contribution to xterm.js.

Bold text bright color setting

The terminal currently converts all bold text to use the bright color variant. This is a little inconsistent across terminal emulators and is mostly around for legacy reasons. You can now turn this automatic conversion off to allow the use of non-bright colors for bold text.

This came in as an upstream community contribution to xterm.js.

Debugging

Floating debug toolbar

In the previous milestone, we have introduced a new setting to dock the debug toolbar in the Debug view ( «debug.toolBarLocation»: «docked» ). In this milestone, we reviewed user feedback and tried to improve the floating toolbar behavior as well ( «debug.toolBarLocation»: «floating» ).

The consensus from feedback was that the toolbar should always be visible (independent from which view is active) and that it should not hide anything (for instance the editor tabs). Therefore, we’ve «unchained» the floating toolbar by allowing it to be dragged to the editor area. This should help users that heavily use editor tabs but also want to see the debug toolbar at all times.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Languages

TypeScript 2.9.2

VS Code now ships with TypeScript 2.9.2. This minor release fixes a number of bugs and improves stability. You can read about the complete set of changes here.

Update import paths on folder rename

Last release brought automatic import path updating when you move or rename a JavaScript or TypeScript file. This feature now also works when you move or rename a directory. Again, by default, VS Code will prompt you if we can update paths. You can control the prompting behavior with the javascript.updateImportsOnFileMove.enabled and typescript.updateImportsOnFileMove.enabled settings.

Valid values are:

Hierarchical Markdown document symbols

The built-in Markdown support uses the new DocumentSymbol API to make sure Markdown headers are properly nested in the Outline view.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

New CSS pseudo selectors and pseudo elements from MDN

In the April release, we started sourcing data from Mozilla Developer Network for up-to-date CSS/SCSS/Less support. In this release, we added the following pseudo selectors / elements:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Improved accuracy of Browser Compatibility Data

Thanks to mdn/browser-compat-data, we brought this section from MDN to our CSS/SCSS/Less completions:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

The justify-items property, alongside many other CSS properties for CSS Grid Layout, has been supported in Edge since version 16. By sourcing data from MDN, VS Code keeps browser compatibility data for CSS features up-to-date.

Graceful handling of unknown At-Rules

People who are using CSS pre-processors may use custom at-rules that are compiled to valid CSS at build time. Previously, VS Code could not parse or handle such at-rules. In this release, we have better support for at-rules, so that they:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Extensions

New default view for Extensions view

Until now, the default view for the Extensions view contained a section for Installed extensions and another for Recommended extensions. The presence of installed but disabled extensions among the enabled ones made it hard to interact with the latter. We now provide a new default, where the Enabled extensions are shown first, followed by a section for Recommended extensions, and, at the bottom, a collapsed section for Disabled extensions.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

You can always re-order, collapse/expand, or hide any of these sections by using the context menu in the Extensions view. You can also use the Open View. command in the View menu to show/hide these sections.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Dismiss extension recommendations

We recommend extensions to you based on the files you have opened and your workspace environment. We understand that not every recommendation might be appropriate for your project and so you can now dismiss specific recommendations.

To dismiss a recommendation, click on the extension item to open the Details pane and then press the Ignore Recommendation button. Ignored recommendations will no longer be recommended to you.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Manage workspace recommendations

You could already configure a set of extensions to be recommended for users of your workspace using workspace recommendations in an extensions.json file. Managing these recommendations is now much easier. Click on any extension in the Extensions view to open the Details pane. You can then use the new commands below to add recommendations or disallow certain extensions that you don’t want recommended for users of your workspace.

Language Packs

VS Code now ships with only English as the display language and other languages rely on Language Packs installable from the VS Code Marketplace. You should not notice this change if you had installed a Language Pack when prompted by the 1.23 or 1.24 versions of VS Code. If you are upgrading from an older version of VS Code or have a fresh installation, you will see a prompt to install the Language Pack of your OS’s UI language. Additional Language Packs can be installed from the Marketplace using the Extensions view ( ⇧⌘X (Windows, Linux Ctrl+Shift+X ) ).

Preview Features

Preview features are not ready for release but are functional enough to use. We welcome your early feedback while they are under development.

New Settings Editor

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Some of the new changes compared to last month are:

User setup for Windows

Windows users now have a new Preview setup package available, which does not require Administrator privileges to install. This setup package also provides a smoother background update experience. This feature is only available on Insiders for now, as we’d like more feedback during July in order to provide the best experience for our Stable user base.

Here are the download links for the Insiders user setup packages:

Custom title bar and menus for Windows/Linux

Windows and Linux users can now use the window.titleBarStyle setting value custom and we’ve implemented a new menu bar to match. The setting is not yet enabled by default but can be turned on with the window.titleBarStyle setting.

With the setting enabled for Windows and Linux, the old menu bar will be replaced with a new menu bar that matches your light or dark theme. The new menu bar also comes with some enhancements such as top-level keyboard navigation with the arrow keys. Lastly, the menus throughout the product will also match the new menu bar.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

We will continue to improve the new menus and title bar as well as address issues tagged with the workbench-title or workbench-menu labels.

Terminal: Dynamic texture atlas

An experimental setting has been added to enable the new «dynamic texture atlas» for the terminal canvas. This changes the caching strategy used by the terminal to store character glyphs. Instead of being a fixed set of glyphs on the default background, glyphs are now added to the texture atlas as they are required and regardless of the background being used. This should reduce the first terminal start up time, reduce rendering time of characters not using the default background, as well as improving overall rendering performance.

This will eventually be the default, for now you can opt-in with the following setting:

This came in as an upstream community contribution to xterm.js.

Extension Authoring

Grid Editor Layout: ViewColumn

The ViewColumn value for text editors and webviews still goes by the order of appearance in the editor area from left to right as shown below:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

When an editor group is moved or an editor group is closed, the onDidChangeTextEditorViewColumn event is fired as before.

Grid Editor Layout: New Commands

Even though the change to the API is minimal to support the new grid editor layout, extensions can still make use of the grid editor layout by leveraging new commands that were added (see the New Commands section for a complete overview).

The new vscode.setEditorLayout deserves a bit of explanation as it allows you to change the overall editor layout with a single command and arguments. The layout is described as object with an initial (optional) orientation ( 0 = horizontal, 1 = vertical) and an array of editor groups within. Each editor group can have a size and another array of editor groups that will be laid out orthogonal to the orientation. If editor group sizes are provided, their sum must be 1 to be applied per row or column.

Example for a 2×2 grid:

Editors open in active ViewColumn by default

Preselected Completion Items

The API addition is ‘CompletionItem#preselect: boolean’ and when many preselected items exists, the one with the highest rank is selected.

Document Symbols

Readonly file system provider

Custom views

Tree view visibility

You can now check if the tree view is visible or not using the following newly added property and event to TreeView :

Selection Listener

A new selection change event was added to the tree view to listen to the selection changes:

Reveal and Focus

You can now reveal and focus an element in the tree view by setting the focus option to true while calling the reveal API.

New Theme colors

There are two new theme colors for the background color of empty editor groups, a feature that came out of the work to support grid editor layout:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Deprecated Theme colors

The theme color editorGroup.background is no longer supported with the introduction of the grid editor layout feature.

Rename Command

The rename-command ( editor.action.rename ) can now be invoked with an Uri and a Position and the editor will initiate a rename operation accordingly. For example:

DiagnosticTag

Diagnostic tags allow extensions to attach additional metadata about a diagnostic. VS Code uses this metadata to tweak how these diagnostics are rendered.

DiagnosticTag.Unnecessary indicates that a diagnostic is for unreferenced or unreachable source code. Any source code marked with DiagnosticTag.Unnecessary will be rendered faded out. The amount of fading is controlled by the «editorUnnecessaryCode.opacity» theme color. For example, «editorUnnecessaryCode.opacity»: «#000000c0» will render the code with 75% opacity. For high contrast themes, use the «editorUnnecessaryCode.border» theme color to underline unnecessary code instead of fading it out.

WebviewPanel.active and WebviewPanel.visible

Webview panels have two new readonly properties:

Webview persistence

The webview API has been extended with support for saving and restoring the state of a webview.

The getState and setState APIs inside the webview context allow a webview to save state and get a state object that is persisted even when the webview itself goes into a background tab.

In addition, extensions can register a WebviewPanelSerializer that allows webviews of a given type to be persisted across restarts of VS Code. To enable this, the extension must call vscode.window.registerWebviewPanelSerializer in its activation method.

The extension must also add a onWebviewPanel activation event:

The new webview persistence APIs are documented on the webview extension authoring page. The example webview extension also demonstrates how to use these new APIs.

Language Packs: Minimal translations

VS Code will now prompt users for an available Language Pack in the language of the Language Pack. Below is an example recommending a Simplified Chinese Language Pack in Simplified Chinese and English.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

This display requires that Language Pack authors translate the following minimal translation strings in their Language Pack:

Language Server Protocol Inspector

Language Servers that use vscode-languageclient can specify a setting [langId].trace.server to receive logging support. Although the generated log is valuable for understanding the LSP communication between VS Code and Language Servers, the log can be long and hard to extract useful information from.

With the new LSP Inspector, you now have a tool to help understand LSP logs: https://microsoft.github.io/language-server-protocol/inspector/

In the Inspector, you can:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

The Inspector can be useful for debugging Language extensions. You can ask users to attach LSP logs to their bug reports and use the Inspector to analyze the logs.

The Language Server Guide has been updated to include sections on logging support and the features of the LSP Inspector.

Language Server: End to End testing

A section on End to End Testing has been added to the Language Server Guide.

Compared to unit-testing components of Language Servers, End to End tests open a workspace in VS Code, launch the Language extension in the Extension Host, and make assertions against the real behavior of the Language extension. This makes mocking workspace and VS Code state easy and checks real VS Code behavior.

Language Server: Refreshed guide

The Language Server Guide has received a refresh. Major improvements include:

Proposed Extension APIs

Every milestone comes with new proposed APIs and extension authors can try them out. As always we are keen on your feedback. This is what you have to do to try out a proposed API:

Note that you cannot publish an extension that uses a proposed API. We may likely make breaking changes in the next release and we never want to break existing extensions.

WorkspaceEdit can create/rename/delete Files

We have added a proposed API that extends WorkspaceEdit so that it can be used to create, rename, and delete files or folders. This is useful for complex refactorings, for example renaming a file when a type is being renamed, but should also enable other scenarios.

Local Rename Events

We are proposing two events that fire before and after a rename occurs. They are called onWillRenameFile and onDidRenameFile and they allow an extension to react or participate in the rename.

QuickInput API

The new QuickPick and InputBox APIs allow for more flexible collection of user input than the existing showQuickPick and showInputBox APIs. With the new APIs, you create a new instance of an input object on which you then register event handlers and set properties according to your use case:

There are samples of QuickInput API usage in a sample extension.

The multi-step input sample:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

If the existing showQuickPick and showInputBox APIs are not flexible enough, use the new QuickPick and InputBox APIs, otherwise keep to the existing ones as these will get the job done quicker.

Use issue #53327 for feedback and discussion.

Terminal renderers

The concept of a terminal «renderer» is being proposed. A terminal renderer is basically a terminal instance within the terminal panel but it has no backing process, instead the extension acts as the process. This is useful for implementing a terminal multiplexer within VS Code where the extension has access to the in/out pipes of some process, which are hooked then up to the terminal renderer. The Live Share extension is planning on using this new API to improve the stability and maintainability of its shared terminal support.

Another example use case is an extension creating its own REPL. This works by the extension listening to every character press and acting when the Enter key is pressed:

Tracking the active terminal

We are proposing new extension APIs for the Integrated Terminal that make it possible to track the active terminal, similar to window.activeTextEditor and window.onDidChangeActiveTextEditor :

Terminal.onData renamed

Terminal.onData has been renamed to onDidWriteData in order to align with our naming guidelines:

DefinitionLink

Definition links allow definition providers to return additional metadata with definitions:

This additional information is used by VS Code to improve the user experience for Go to Definition actions.

New Commands

New layoutEditorGroups command

The layoutEditorGroups command lets you create an editor group layout and assign it a keybinding. The layout is described as an object with an initial (optional) orientation ( 0 = horizontal, 1 = vertical) and an array of editor groups within. Each editor group can have a size and another array of editor groups that will be laid out orthogonal to the orientation. If editor group sizes are provided, their sum must be 1 to be applied per row or column. For example:

This will produce the following layout:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Removed Commands

Command idReplacement
workbench.action.showEditorsInFirstGroupUse showEditorsInActiveGroup instead
workbench.action.showEditorsInSecondGroupUse showEditorsInActiveGroup instead
workbench.action.showEditorsInThirdGroupUse showEditorsInActiveGroup instead
workbench.action.moveEditorToSecondGroupUse a workbench.action.moveEditor* command instead
workbench.action.moveEditorToThirdGroupUse a workbench.action.moveEditor* command instead
workbench.action.openLastEditorInGroupUse lastEditorInGroup instead
workbench.action.openFolderAsWorkspaceInNewWindowUse duplicateWorkspaceInNewWindow instead
editor.debug.action.toggleColumnBreakpointUse toggleInlineBreakpoint instead

History Navigation Commands

Command idReplacement
search.history.showPreviousUse history.showPrevious instead
search.history.showNextUse history.showNext instead
search.replaceHistory.showPreviousUse history.showPrevious instead
search.replaceHistory.showNextUse history.showNext instead
search.history.showPreviousIncludePatternUse history.showPrevious instead
search.history.showNextIncludePatternUse history.showNext instead
search.history.showPreviousExcludePatternUse history.showPrevious instead
search.history.showNextExcludePatternUse history.showNext instead
find.history.showPreviousUse history.showPrevious instead
find.history.showNextUse history.showNext instead
workbench.action.terminal.findWidget.history.showPreviousUse history.showPrevious instead
workbench.action.terminal.findWidget.history.showNextUse history.showNext instead
editor.action.extensioneditor.showPreviousFindTermUse history.showPrevious instead
editor.action.extensioneditor.showNextFindTermUse history.showNext instead
editor.action.webvieweditor.showPreviousFindTermUse history.showPrevious instead
editor.action.webvieweditor.showNextFindTermUse history.showNext instead
repl.action.historyPreviousUse history.showPrevious instead
repl.action.historyNextUse history.showNext instead

New Documentation

New Python Flask tutorial

There is a new Using Flask in Visual Studio Code tutorial showing how you can quickly create, edit, and debug a Python Flask web application in VS Code.

Updated website deployment tutorial

We’ve updated the Deploy static website to Azure tutorial for creating and deploying a static website using Azure Storage. Website deployment is simplified with the new features provided by Azure Storage extension.

Notable Changes

Thank You

Last but certainly not least, a big Thank You! to the following folks that helped to make VS Code even better:

Contributions to vscode :

Contributions to vscode-vsce :

Contributions to language-server-protocol :

Contributions to vscode-node-debug :

Contributions to vscode-chrome-debug-core :

Contributions to vscode-chrome-debug :

Contributions to localization :

There are over 800 members in the Transifex VS Code project team with about 100 active contributors every month. We appreciate your contributions, either by providing new translations, voting on translations, or suggesting process improvements.

Here is a snapshot of contributors for this release. For details about the project including the contributor name list, visit the project site at https://aka.ms/vscodeloc.

Visual Studio Code FAQ

Our docs contain a Common questions section as needed for specific topics. We’ve captured items here that don’t fit in the other topics.

If you don’t see an answer to your question here, check our previously reported issues on GitHub and our release notes.

What is the difference between Visual Studio Code and Visual Studio IDE?

Visual Studio Code is a streamlined code editor with support for development operations like debugging, task running, and version control. It aims to provide just the tools a developer needs for a quick code-build-debug cycle and leaves more complex workflows to fuller featured IDEs, such as Visual Studio IDE.

Which OSs are supported?

VS Code runs on macOS, Linux, and Windows. See the Requirements documentation for the supported versions. You can find more platform specific details in the Setup overview.

Is VS Code free?

Yes, VS Code is free for private or commercial use. See the product license for details.

How to disable telemetry reporting

VS Code collects usage data and sends it to Microsoft to help improve our products and services. Read our privacy statement and telemetry documentation to learn more.

Important Notice: VS Code gives you the option to install Microsoft and third party extensions. These extensions may be collecting their own usage data and are not controlled by the telemetry.telemetryLevel setting. Consult the specific extension’s documentation to learn about its telemetry reporting.

How to disable experiments

How to disable crash reporting

VS Code collects data about any crashes that occur and sends it to Microsoft to help improve our products and services. Read our privacy statement and telemetry documentation to learn more.

If you don’t want to send crash data to Microsoft, you can change the enable-crash-reporter runtime argument to false

GDPR and VS Code

Now that the General Data Protection Regulation (GDPR) is in effect, we want to take this opportunity to reiterate that we take privacy very seriously. That’s both for Microsoft as a company and specifically within the VS Code team.

To support GDPR:

You can learn more about VS Code’s GDPR compliance in the telemetry documentation.

What online services does VS Code use?

Beyond crash reporting and telemetry, VS Code uses online services for various other purposes such as downloading product updates, finding, installing, and updating extensions, or providing Natural Language Search within the Settings editor. You can learn more in Managing online services.

How do I opt out of VS Code auto-updates?

If you use the JSON editor for your settings, add the following line:

You can install a previous release of VS Code by uninstalling your current version and then installing the download provided at the top of a specific release notes page.

Note: On Linux: If the VS Code repository was installed correctly then your system package manager should handle auto-updating in the same way as other packages on the system. See Installing VS Code on Linux.

Opt out of extension updates

By default, VS Code will also auto-update extensions as new versions become available. If you do not want extensions to automatically update, you can clear the Extensions: Auto Update check box in the Settings editor ( ⌘, (Windows, Linux Ctrl+, ) ).

If you use the JSON editor to modify your settings, add the following line:

Licensing

Location

Why does Visual Studio Code have a different license than the vscode GitHub repository?

To learn why Visual Studio Code, the product, has a different license than the open-source vscode GitHub repository, see issue #60 for a detailed explanation.

What is the difference between the vscode repository and the Microsoft Visual Studio Code distribution?

What does «Built on Open Source» mean?

How do I find the license for an extension?

Most extensions link to their license on their Marketplace page or in the overview section, when you select an extension in the Extensions view.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

If you don’t find a link to the license, you may find a license in the extension’s repository if it is public, or you can contact the extension author through the Q & A section of the Marketplace.

Are all VS Code extensions open source?

Extension authors are free to choose a license that fits their business needs. While many extension authors have opted to release their source code under an open-source license, some extensions like Wallaby.js, Google Cloud Code, and the VS Code Remote Development extensions use proprietary licenses.

At Microsoft, we open source our extensions whenever possible. However, reliance on existing proprietary source code or libraries, source code that crosses into Microsoft licensed tools or services (for example Visual Studio), and business model differences across the entirety of Microsoft will result in some extensions using a proprietary license. You can find a list of Microsoft contributed Visual Studio Code extensions and their licenses in the Microsoft Extension Licenses article.

How do I find the version?

You can find the VS Code version information in the About dialog box.

On macOS, go to Code > About Visual Studio Code.

On Windows and Linux, go to Help > About.

The VS Code version is the first Version number listed and has the version format ‘major.minor.release’, for example ‘1.27.0’.

Previous release versions

You can find links to some release downloads at the top of a version’s release notes:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

If you need a type of installation not listed there, you can manually download via the following URLs:

Download typeURL
Windows 64 bit System installerhttps://update.code.visualstudio.com//win32-x64/stable
Windows 64 bit User installerhttps://update.code.visualstudio.com//win32-x64-user/stable
Windows 64 bit ziphttps://update.code.visualstudio.com//win32-x64-archive/stable
Windows 64 bit ARM System installerhttps://update.code.visualstudio.com//win32-arm64/stable
Windows 64 bit ARM User installerhttps://update.code.visualstudio.com//win32-arm64-user/stable
Windows 64 bit ARM ziphttps://update.code.visualstudio.com//win32-arm64-archive/stable
Windows 32 bit System installerhttps://update.code.visualstudio.com//win32/stable
Windows 32 bit User installerhttps://update.code.visualstudio.com//win32-user/stable
Windows 32 bit ziphttps://update.code.visualstudio.com//win32-archive/stable
macOShttps://update.code.visualstudio.com//darwin/stable
Linux 64 bithttps://update.code.visualstudio.com//linux-x64/stable
Linux 64 bit debianhttps://update.code.visualstudio.com//linux-deb-x64/stable
Linux 64 bit rpmhttps://update.code.visualstudio.com//linux-rpm-x64/stable
Linux 64 bit snaphttps://update.code.visualstudio.com//linux-snap-x64/stable
Linux ARMhttps://update.code.visualstudio.com//linux-armhf/stable
Linux ARM debianhttps://update.code.visualstudio.com//linux-deb-armhf/stable
Linux ARM rpmhttps://update.code.visualstudio.com//linux-rpm-armhf/stable
Linux 64 bit ARMhttps://update.code.visualstudio.com//linux-arm64/stable
Linux 64 bit ARM debianhttps://update.code.visualstudio.com//linux-deb-arm64/stable
Linux 64 bit ARM rpmhttps://update.code.visualstudio.com//linux-rpm-arm64/stable

Substitute the specific release you want in the placeholder. For example, to download the Linux ARM debian version for 1.50.1, you would use

Prerelease versions

Want an early peek at new VS Code features? You can try prerelease versions of VS Code by installing the «Insiders» build. The Insiders build installs side by side to your stable VS Code install and has isolated settings, configurations, and extensions. The Insiders build is updated nightly so you’ll get the latest bug fixes and feature updates from the day before.

To install the Insiders build, go to the Insiders download page.

Where can I find the Visual Studio Code icons?

Are there guidelines for using the icons and names?

You can download the official Visual Studio Code icons and read the usage guidelines at Icons and names usage guidelines.

What is a VS Code «workspace»?

You can learn more in the What is a VS Code «workspace»? article.

Can I run a portable version of VS Code?

Yes, VS Code has a Portable Mode that lets you keep settings and data in the same location as your installation, for example, on a USB drive.

Report an issue with a VS Code extension

For bugs, feature requests or to contact an extension author, you should use the links available in the Visual Studio Code Marketplace or use Help: Report Issue from the Command Palette. However, if there is an issue where an extension does not follow our code of conduct, for example it includes profanity, pornography or presents a risk to the user, then we have an email alias to report the issue. Once the mail is received, our Marketplace team will look into an appropriate course of action, up to and including unpublishing the extension.

Installation appears to be corrupt [Unsupported]

VS Code does a background check to detect if the installation has been changed on disk and if so, you will see the text [Unsupported] in the title bar. This is done since some extensions directly modify (patch) the VS Code product in such a way that is semi-permanent (until the next update) and this can cause hard to reproduce issues. We are not trying to block VS Code patching, but we want to raise awareness that patching VS Code means you are running an unsupported version. Reinstalling VS Code will replace the modified files and silence the warning.

You may also see the [Unsupported] message if VS Code files have been mistakenly quarantined or removed by anti-virus software (see issue #94858 for an example). Check your anti-virus software settings and reinstall VS Code to repair the missing files.

Resolving shell environment fails

This section applies to macOS and Linux environments only.

However, when launching from your platform’s user interface (for example, the VS Code icon in the macOS dock), you normally are not running in the context of a shell and you don’t have access to those environment settings. This means that depending on how you launch VS Code, you may not have the same environment.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

If the error message indicates that resolving your shell environment took too long, the steps below can help you investigate what might be causing slowness.

If you see other errors, please create an issue to get help.

Investigate slow shell initialization

The process outlined below may help you identify which parts of your shell initialization are taking the most time:

Note: While nvm is a powerful and useful Node.js package manager, it can cause slow shell startup times, if being run during shell initialization. You might consider package manager alternatives such as asdf or search on the internet for nvm performance suggestions.

Launch VS Code from a terminal

If modifying your shell environment isn’t practical, you can avoid VS Code’s resolving shell environment phase by launching VS Code directly from a fully initialized terminal.

VS Code is blank?

VS Code gets unresponsive right after opening a folder

When you open a folder, VS Code will search for typical project files to offer you additional tooling (for example, the solution picker in the Status bar to open a solution). If you open a folder with lots of files, the search can take a large amount of time and CPU resources during which VS Code might be slow to respond. We plan to improve this in the future but for now you can exclude folders from the explorer via the files.exclude setting and they will not be searched for project files:

Technical Support

You can ask questions and search for answers on Stack Overflow and enter issues and feature requests directly in our GitHub repository.

If you’d like to contact a professional support engineer, you can open a ticket with the Microsoft assisted support team.

Remote Development FAQ

This article covers frequently asked questions for each of the Visual Studio Code Remote Development extensions. See the SSH, Containers, and WSL articles for more details on setting up and working with each of their respective capabilities. Or try the introductory Tutorials to help get you running quickly in a remote environment.

General

What is Visual Studio Code Remote Development?

The Visual Studio Code Remote Development extension pack allows you to open any folder in a container, on a remote machine (via SSH), or in the Windows Subsystem for Linux and take advantage of VS Code’s full feature set. This means that VS Code can provide a local-quality development experience — including full IntelliSense (completions), debugging, and more — regardless of where your code is located or hosted.

What advantages does VS Code Remote Development provide over local editing?

Some benefits of remote development include:

Compared to using a network share or synchronizing files, VS Code Remote Development provides dramatically better performance along with better control over your development environment and tools.

How do the Remote Development extensions relate to GitHub Codespaces?

GitHub Codespaces is a service that provides managed cloud-hosted development environments accessible from both VS Code and a new browser-based editor. The service also allows VS Code and the browser-based editor to access self-hosted environments (desktop or server) without requiring an SSH server or even a direct network route. You can read more in the GitHub Codespaces documentation.

While the Remote Development and Codespaces extensions share technology and features, the Remote Development extensions are released separately and can operate independently from GitHub Codespaces.

How do the Remote Development extensions work?

Visual Studio Code Remote Development allows your local VS Code installation to transparently interact with source code and runtime environments on other machines (whether virtual or physical) by moving the execution of certain commands to a «remote server». The VS Code Server is quickly installed by VS Code when you connect to a remote endpoint and can host extensions that interact directly with the remote workspace, machine, and file system.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

See Supporting Remote Development for additional details about extensions.

How do the Remote Development extensions secure access to a remote machine, VM, or container?

Visual Studio Code Remote Development uses existing, well known transports like secure shell to authenticate and secure traffic. No ports need to be publicly opened beyond those used by these well-known, secure transports.

The VS Code Server that is injected runs as the same user you used to sign in to the machine, ensuring that VS Code and its extensions are not given improper elevated access without permission. The server is started and stopped by VS Code and is not wired into any user or global login or startup scripts. VS Code manages the server’s lifecycle so you do not need to worry about whether or not it is running.

Can VS Code Server be installed or used on its own?

No. The VS Code Server is a component of the Remote Development extensions and is managed by a VS Code client. It is installed and updated automatically by VS Code when it connects to an endpoint and if installed separately could become quickly out of date. It is not intended or licensed for use by other clients.

What are the connectivity requirements for VS Code Server?

Installation of VS Code Server requires that your local machine have outbound HTTPS (port 443) connectivity to:

You can install extensions manually without an internet connection using the Extensions: Install from VSIX. command, but if you use the extension panel or devcontainer.json to install extensions, your local machine and VS Code Server will need outbound HTTPS (port 443) access to:

All other communication between the server and the VS Code client is accomplished through the following transport channels depending on the extension:

You can find a list of locations VS Code itself needs access to in the network connections article.

By default, the Docker extension will run remotely. While this is a sensible default in some cases, it means the extension may not show local containers when VS Code is connected to a remote SSH host, container, or WSL.

You can use one of the following solutions to resolve this problem:

Open a new local window (File > New Window) and use it to work with local containers.

What Linux packages or libraries need to be installed on a host to use Remote Development?

Remote Development requires kernel >= 3.10, glibc >=2.17, and libstdc++ >= 3.4.18. Recent x86_64 glibc-based distributions have the best support, but exact requirements can vary by distribution.

Can I install individual extensions instead of the extension pack?

Yes. The Remote Development extension pack provides a convenient way for you to access all of the latest remote capabilities as they are released. However, you can always install the individual extensions from the Marketplace or VS Code Extensions view.

How can I review and configure extension settings?

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

What is the advantage of the extension over using WSL as the terminal?

For example, you might install the Go stack in WSL (compiler, debugger, linters, etc.). If you run VS Code only on Windows, you must also install the same Go stack there to get features like smart completions, debugging, Go to Definition navigation. And because the language services are running on Windows, they don’t know what is in WSL.

It’s true that you can run binaries in WSL from Windows and vice-versa, but regular VS Code extensions don’t know how to do this. This is how we started out supporting debugging in WSL, but quickly realized we would have to update all extensions to know about WSL.

With this approach, language features like smart completions just work against what is in WSL without having to set up anything on Windows. You don’t have to worry about path issues or set up different versions of development stacks on Windows. If you are deploying applications to Linux, you can set up your WSL instances to look like your runtime environment while still getting a rich editing experience on Windows.

Do «dev container definitions» define how an application is deployed?

No. A development container defines an environment in which you develop your application before you are ready to deploy. While deployment and development containers may resemble one another, you may not want to include tools in a deployment image that you use during development.

The vscode-dev-containers repository includes a set of dev container definitions for some common development environments. You can also attach to a running container without setting up a dev container definition, if you prefer to use an alternate container build or deployment workflow.

Do «dev containers definitions» define how an application is built? Like Buildpacks?

No. The Buildpacks concept focuses on taking source code and generating deployable container images through a series of defined steps. A dev container is an environment in which you can develop your application before you are ready to build. They are therefore complementary concepts.

Extensions authors

As an extension author, what do I need to do?

The VS Code extension API abstracts away local/remote details so most extensions will work without modification. However, given extensions can use any node module or runtime they want, there are situations where adjustments may need to be made. We recommend you should test your extension (particularly in a container) to be sure that no updates are required. See Supporting Remote Development for details.

Can an extension access local resources or APIs when a user is connected remotely?

When VS Code connects to a remote environment, extensions are classified as either UI or Workspace extensions. UI Extensions run in a local extension host, can contribute UI or personalization features (for example themes), and have access to local files or APIs. Workspace extensions run in a remote extension host with the workspace and have full access to the source code, remote filesystem, and remote APIs. While Workspace extensions do not focus on UI customization, they can contribute explorers, views, and other UI elements as well.

License and privacy

Location

You can find the licenses for the VS Code Remote Development extensions here:

Why aren’t the Remote Development extensions or their components open source?

The Visual Studio Code Remote Development extensions and their related components use an open planning, issue, and feature request process, but are not currently open source. The extensions share source code which is also used in fully managed remote development services like GitHub Codespaces and their related extensions. Given that these services also will support other proprietary products (for example Visual Studio IDE), the extensions are available under a Microsoft pre-release license like other service-based, cross-product extensions such as Visual Studio IntelliCode and Visual Studio Live Share were during their preview periods.

Will you charge for the Remote Development extensions once they exit «Preview»?

No, they will remain free of charge. In the future, we may provide additional «premium» developer services like GitHub Codespaces, which provide additional functionality, but the extensions will be free.

Are there any restrictions on where the Remote Development extensions can connect?

You are free to use the extensions for both personal or corporate use to connect to your own physical machines, virtual machines, or containers. These can be on-premise, in your own private cloud or datacenter, in Azure, or other cloud/non-cloud hosting providers. You cannot build public products or services on top of the extensions or their related components (see next question).

Can I use the VS Code Remote Development extensions to build my own product or service?

You can use the extensions with your own internal or private services. You cannot build a public or commercial service on top of the VS Code Remote Development extensions or their related components (for example VS Code Server). You cannot create other extensions that extend or manipulate the Remote Development extensions. While the license states you may not «provide the software as a stand-alone or integrated offering or combine it with any of your applications for others to use», you can document how to use the extensions in conjunction with your service.

Can I repackage or reuse VS Code Server in my own public service offering?

No. The license states that you may not «provide the software as a stand-alone or integrated offering or combine it with any of your applications for others to use» which means you may not build public products or services on top of the VS Code Server.

I have a question about whether I can use the extensions for X, who can I ask?

Please email us at VSCode@microsoft.com with any questions you may have.

GDPR and VS Code Remote Development

The VS Code Remote Development extensions follow the GDPR policies as Visual Studio Code itself. See the general FAQ for more details.

June 2019 (version 1.36)

Update 1.36.1: The update addresses these issues.

Welcome to the June 2019 release of Visual Studio Code. There are a number of updates in this version that we hope you will like, some of the key highlights include:

If you’d like to read these release notes online, go to Updates on code.visualstudio.com.

Insiders: Want to see new features as soon as possible? You can download the nightly Insiders build and try the latest updates as soon as they are available. And for the latest Visual Studio Code news, updates, and content, follow us on Twitter @code!

Workbench

Hide individual status bar items

There is now a context menu for the status bar to hide and show individual entries.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

The configuration is persisted globally across all workspaces.

Note: The setting workbench.statusBar.feedback.visible was removed in favor of this new approach. You can hide the feedback smiley using the status bar context menu.

Tree indent guides

The tree widget now supports indent guides. This means indent guides are now available in the File Explorer, Search view, Debug views, etc.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

As before, you can control the tree’s indentation level using the workbench.tree.indent setting and now you can also control how indent guides behave with the workbench.tree.renderIndentGuides setting.

The possible values for workbench.tree.renderIndentGuides are:

Drag and drop a folder to copy

It is now possible to drag and drop a folder from outside VS Code into the File Explorer to copy it. Previously, when dropping a folder into the VS Code Explorer, we would always open a workspace containing that folder. Now it is possible to just copy the folder content.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Copy paste filename incrementor change

When copy pasting files and folders that are duplicates inside the VS Code Explorer, VS Code increments the name of the pasted file. The way we were doing the incremental naming sometimes led to unexpected results.

To try to simplify naming, we now increment the filename the following way:

Disable Alt key focus of the custom menu bar

Minimap search decorations

When searching within a file, the resulting matches will now be highlighted both within the file and in the minimap:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Updated warning colors

We’ve updated list.warningForeground and editorWarning.foreground to better match the rest of the editor warning colors. You’ll see this updated color in the File Explorer, Peek error view, and editor squiggles:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

We also updated editorOverviewRuler.findMatchForeground to better stand out with the updated warning colors in the ruler:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Online services settings

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

For more information, see our telemetry documentation.

Integrated Terminal

Better default shell selector

Windows has had the Select Default Shell command for some time and last release it was added to the Integrated Terminal dropdown menu. This command is now also available on macOS and Linux and exposes the shells registered on the system by reading the /etc/shells file.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Launch terminals with clean environments

Instead, depending on the platform, it will do the following:

Change to Ctrl+\

Previously, Ctrl+\ was mapped to the command to split the terminal on Linux and Windows but this has been changed to pass SIGQUIT through to the shell, as most people would expect a terminal to do. If you want the old behavior, you can add this keyboard shortcut to your keybindings.json file.

Tasks

Sequential dependency execution

The example task below runs task Two, task Three, and then task One.

Problem matcher path detection

Languages

TypeScript 3.5.2

This release includes TypeScript 3.5.2, a small update that fixes a few important bugs.

Use syntax only feature of JavaScript and TypeScript more quickly

VS Code’s JavaScript and TypeScript language features is powered by a TypeScript server. This server powers complex features such as IntelliSense and error reporting, along with simpler features such as code folding and document outlines.

Features such as IntelliSense require that the TypeScript server evaluate the entire JavaScript or TypeScript project before it can return any results, and this can take time for larger projects. While this processing is happening, the server is not able to handle any other requests, including requests for simple features like code folding that only require a basic semantic understanding of the current file. You may have seen this issue if you’ve ever noticed a delay before code folding or the document outline become available.

Debugging

Jump to cursor

We have added a new debug command Jump to Cursor, which lets you move program execution to a new location without executing any of the code in between. If Jump to Cursor is supported by a debugger, the new command appears in the editor context menu and Command Palette while debugging. Currently this command is only available from the C# extension, but other debug extensions should follow soon.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Disable console word wrap

Node.js debug configuration attribute useWSL is deprecated

For more information, see our Developing in WSL documentation.

Contributions to extensions

JavaScript and TypeScript nightly extension

The new JavaScript and TypeScript nightly extension uses the nightly build of TypeScript (typescript@next) for VS Code’s built-in TypeScript version, which powers JavaScript and TypeScript IntelliSense. This makes it easy to test the latest TypeScript features and provide feedback about them!

TSLint 1.2

We’ve published a new version of the TSLint extension that fixes a few important bugs. This release also adds a warning indicator to the VS Code status bar if there is a tslint.json file in a workspace but TSLint itself is not properly installed.

Installer for Java developers

There is a new Visual Studio Code Installer for Java to help first-time developers set up their Java environment. When you run the Java Pack Installer, it automatically detects whether the JDK (Java Development Kit), Visual Studio Code, and required extensions are already installed. If not, the installer can download and configure the missing dependencies for you. You can also use the installer to add the Java-related components to your existing Visual Studio Code installation.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

With the Java extensions installed, Visual Studio Code provides comprehensive Java development features such as smart code completion, refactoring, debugging, and testing as well as project management and application server integration.

Remote Development (Preview)

Work has continued on the Remote Development extensions, which allow you to use a container, remote machine, or the Windows Subsystem for Linux (WSL) as a full-featured development environment. You can learn about new extension features and bug fixes in the Remote Development release notes.

And to learn more about developing Linux applications on Windows, see this Linux development with WSL and Visual Studio Code Remote blog post from the Windows Developer Platform team.

Debugger for Chrome as remote UI extension

If you are working on a web project in a remote window, you can use the Debugger for Chrome extension to debug it in a local Chrome window. Just install the extension, start your dev server on the remote, forward the server’s port, and start your launch configuration. See the extension README for details.

Extension authoring

Splitting vscode package into @types/vscode and vscode-test

The vscode package had served two purposes:

Node.js update

APIs for remote

There is a new property vscode.env.remoteName that is defined whenever a remote extension host runs. Its value is defined by the extension bootstrapping the remote extension host and the value is available on the local and remote extension hosts.

DocumentLink.tooltip

The new DocumentLink.tooltip property allows a DocumentLinkProvider to customize the text displayed when a user hovers over a document link:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

VS Code includes instructions on how to activate the link ( cmd + click in the example above) along with the tooltip text.

Port forwarding and port mapping now support ‘127.0.0.1’ in addition to ‘localhost’

Additionally, the webview port mapping API now handles ‘127.0.0.1’ in addition to ‘localhost’ URIs.

More properties marked as readonly or ReadonlyArray

More properties in the VS Code API are now marked as readonly in vscode.d.ts to better express their intent to extensions.

Notable changes include:

These new readonly modifiers may cause compile errors for extension code that explicitly typed out the non-readonly types that the VS Code API was previously using:

To fix this, propagate the readonly modifier through your extension’s source code as well:

TerminalOptions.hideFromUser

The runInBackground terminal hideFromUser option is now in the stable API. Use this option to completely hide a terminal from the user until Terminal.show() is called:

Combined with the sendText and onDidWriteData APIs, it’s possible for an extension to interact with an interactive terminal, for example, to set up a connection, and only call Terminal.show() if something goes wrong.

Comment reactions

The Comments API now supports displaying and managing user reactions on comments. When Comment.reactions is present, reactions will be rendered under the comment body.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Proposed extension APIs

Every milestone comes with new proposed APIs and extension authors can try them out. As always we are keen on your feedback. This is what you have to do to try out a proposed API:

Note that you cannot publish an extension that uses a proposed API. We may likely make breaking changes in the next release and we never want to break existing extensions.

vscode.workspace.fs

There is proposed API to allow extensions to interact with file system providers. The API lets extensions create, read, write, and delete files and folders from arbitrary file systems. For example, a language extension can now load source files that are provided from an ftp-server or another remote source.

Updated API for code insets

We have refactored and simplified the code insets proposal. Instead of using the provider-pattern, it is now more like the text decorations API.

Webview.resourceRoot

The proposed resourceRoot constant on webviews exposes the root from which local resources are loaded in webviews.

API to get the default shell

Since the terminal.integrated.shell.

Language Server Protocol

A new version of the Language Server Index Format tools for TypeScript have been implemented. The new versions have an improved format for easier importing of large dumps into databases without making it database specific. See the instructions in the lsif-node repository for details on running these tools.

Engineering

Electron 4.0 update and Electron 6.0 exploration

In this milestone, we finished the exploration of bundling Electron 4 into VS Code, making it the first time this Electron version ships with stable. This is a major Electron release and comes with Chrome 69 and Node.js 10.11.0 (a major leap forward from our current version with Chrome 66 and Node.js 10.2.0).

Unfortunately, we had to disable macOS simple fullscreen support ( «window.nativeFullScreen»: false ) for one release due to issue #75054. We expect to include a fix to our Insiders build early next month.

We have started to explore updating to Electron 6, which we hope to push to Insiders soon.

Better code loading

Electron 4 gave us access to new script caching APIs. With the new caching APIs, cached data can be created without affecting the very first start-up and can be created repeatedly to cover lazily parsed functions. That and improvements in our loader resulted in

15% faster code loading.

Linux 32-bit support ends

VS Code is using the Electron framework to run on multiple platforms. With this release, we move to Electron version 4.x, which means that VS Code will no longer run on Linux 32-bit. Please update to a 64-bit version of VS Code. All your settings and extensions will work as before, without the need to migrate anything. You can read the related blog post from Electron for more information.

iframe-based webview exploration

This iteration, we explored using normal iframes instead of Electron’s tags to implement VS Code’s webviews. This work is primarily being done to support running VS Code in the browser, but is also fairly complex and has caused issues for us in the past. Our hope is that we eventually will be able to replace our use of with normal iframes.

We’ve made significant progress on iframe-based webviews and can now successfully run many webviews from extensions in browsers, but there’s still lots of work to be done. We will continue this exploration in July.

Notable fixes

Thank you

Last but certainly not least, a big Thank You! to the following folks that helped to make VS Code even better:

Contributions to vscode :

Contributions to our issue tracking:

Please see our Community Issue Tracking page, if you want to help us manage incoming issues.

Contributions to vscode-css-languageservice :

Contributions to vscode-html-languageservice :

Contributions to language-server-protocol :

Contributions to debug-adapter-protocol :

Contributions to vscode-azurecli :

Contributions to vscode-vsce :

Contributions to vscode-recipes :

Contributions to localization :

There are over 800 Cloud + AI Localization community members using the Microsoft Localization Community Platform (MLCP), with over about 100 active contributors to Visual Studio Code. We appreciate your contributions, either by providing new translations, voting on translations, or suggesting process improvements.

Here is a snapshot of contributors. For details about the project including the contributor name list, visit the project site at https://aka.ms/vscodeloc.

February 2018 (version 1.21)

Update 1.21.1: The update addresses these issues.

Welcome to the February 2018 release of Visual Studio Code. There are a number of significant updates in this version that we hope you will like, some of the key highlights include:

If you’d like to read these release notes online, go to Updates on code.visualstudio.com.
You can also check out this 1.21 release highlights video from Cloud Developer Advocate Brian Clark.

The release notes are arranged in the following sections related to VS Code focus areas. Here are some further updates:

Insiders: Want to see new features as soon as possible? You can download the nightly Insiders build and try the latest updates as soon as they are available.

Workbench

New Notifications UI

We updated the look and feel of notifications in VS Code. Notifications now:

Each notification has the following structure:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

If a notification does not provide any source information or any action buttons, it will show only a severity and message. These types of notifications will hide automatically after a certain timeout.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

A new entry («bell» icon) in the bottom right of the Status Bar indicates the number of new notifications. Once clicked, the Notification Center will open that shows all notifications that were not dismissed yet.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Each notification can be managed with new commands and configurable keybindings (see below in the New Commands section).

Note for extension and theme authors: With the new notification UI, we introduced new theming colors for theme authors to adopt (see below). There is also a soft deprecation of the isCloseAffordance attribute for extension authors which is no longer needed when showing these style of notifications.

Centered editor layout

By popular request #15684, we have added centered editor layout. This layout mode is designed to keep you deeply focused on your code by giving the editor most of the screen real estate.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

If you open another editor to the side, centered layout mode stops until there is only one editor group again. The left and right sash for resizing are coupled so the editor is always centered. Hold down the Alt key if you want to resize the sashes independently. Double click on a sash to bring them back to the default golden ratio size.

Zen mode will now automatically turn this mode on. Use the «zenMode.centerLayout» setting to control this behavior.

Better drag and drop support

We revisited our support for drag and drop in the workbench and now support more drag and drop scenarios. Probably the most up-voted request was to drag files from one File Explorer to another VS Code instance:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

We now also support to drag and drop root folders in the File Explorer to rearrange their order as requested in issue #29715.

Other improvements are to the OPEN EDITORS view. You can now:

Copy/Paste files across windows

We now allow you to copy and paste files between two VS Code File Explorers in different instances. This works for single or multi-selection of files as well as folders.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Symbolic link indication in Explorer

We now indicate symbolic links in the File Explorer by an arrow decoration and additional hover text.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Create multiple folders in the Explorer

When you create a path with subfolders, VS Code will create all the intermediate folders. This can also be used to create a new file:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

NPM Script running

When running scripts in package.json files as tasks using Terminal > Run Tasks, scripts from package.json files in subfolders are now also detected. To exclude folders from script detection, use the npm.exclude setting.

Editor

Text buffer improvements

VS Code has been using a line based representation of the text buffer. It had a lot of advantages but there were also disadvantages, for example, large memory overhead when dealing with large files with many lines.

We introduced a new text buffer implementation in the Insider builds about two months ago. The new buffer implementation is inspired by the piece table data structure and is optimized for source code editing scenarios. It uses less memory to store document metadata making file opening easier and reduces the memory pressure on the operation system. Additionally, it has good editing performance for both small and large files.

The new text buffer performed well during the last two months of Insider testing so we are turning it on for all users in this milestone. It also gives us opportunities for further improvements, like searching in large files.

Coloring of active line number

A new theme key editorActiveLineNumber.foreground can now be defined in themes or settings to customize the line number color of the current line in the editor.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Emmet

VS Code has had support for the bem and comment filters when expanding Emmet abbreviations, but never both at the same time until now.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

To get completions automatically without using the manual trigger, enable the quick suggestions feature for strings in HTML files by adding the following to your settings:

Integrated Terminal

Split terminals

The Integrated Terminal can now be split such that multiple are visible at once, which can enable much easier management of terminals when you need a watch and a run command for example:

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Move cursor with Alt+Click

Additional support for Alt sequences

Pressing Alt+Shift+ and Alt+Ctrl+ while the Integrated Terminal is focused now sends the keystrokes to be handled by the process running inside the terminal.

Right click to select word

Right clicking in the Integrated Terminal will now select the word on macOS. This can be configured to work on other platforms by setting:

Source Control

Editor change navigation

Two new actions let you navigate between active changes in the current file:

Languages

TypeScript 2.7.2

VS Code now includes TypeScript 2.7.2. This update includes a few important bug fixes.

HTML path completion

Path completion has been added to make it easier to import various files in HTML.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Markdown preview bidirectional scroll synchronization

VS Code’s Markdown previews now include bidirectional scroll synchronization. Scroll the editor and the corresponding preview automatically scrolls to match the editor’s view. Scroll the preview, and the editor does the same.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

You can enable or disable scroll synchronization using the «markdown.preview.scrollEditorWithPreview» and «markdown.preview.scrollPreviewWithEditor» settings. The old «markdown.preview.scrollPreviewWithEditorSelection» setting is now deprecated.

Markdown dynamic previews

VS Code’s built-in Markdown preview now automatically changes to preview the active Markdown document. Previously, you had to open a new Markdown preview for every new Markdown file you opened.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

If you’d like a dedicated preview pane for a specific Markdown file, you can «lock» the preview with the Markdown: Toggle Preview Locking command. The locked preview will not automatically switch to preview the active Markdown file. Locked previews are indicated by brackets in the title [Preview].

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Markdown previews can be locked or unlocked using the Markdown: Toggle Preview Locking command. You can also open a locked preview of the current Markdown document using the Markdown: Open Locked Preview to Side command.

Debugging

Breakpoint icons in BREAKPOINTS view

To more easily distinguish between different breakpoints, we have added icons to the BREAKPOINTS view. The icons reflect the type and state of the breakpoint and are the same as in the editor glyph margin. Active breakpoints are red, disabled gray and unverified have a hollow structure. Conditional breakpoints have an equality sign, while function breakpoints are represented with a triangle.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Node debugging

Node.js Version Switcher ‘nvs’ support

Last milestone we’ve added support for the Node Version Manager (‘nvm’). We now also support the Node Version Switcher (‘nvs’). Use the runtimeVersion attribute in a «node» launch configuration for selecting a specific version of Node.js.

Note: Make sure you have the Node.js version installed that you want to use with the runtimeVersion attribute as VS Code will not download and install the version automatically. For example, run something like nvs add 7.10.1 from the Integrated Terminal if you plan to add «runtimeVersion»: «7.10.1» to your launch configuration.

Note: If VS Code detects that ‘nvs’ is installed, it does not fall back to ‘nvm’ if a specific Node.js version cannot be found in ‘nvs’. Using both ‘nvs’ and ‘nvm’ at the same time is not supported.

Extensions

Manage built-in extensions

With this release, you can now manage (disable/enable) the built-in extensions shipped with VS Code. There is an action Show Built-in Extensions in Extensions view that shows all built-in extensions and you can browse and manage them. The same action can be accessed via the Command Palette as well.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Language Packs

In the 1.20 release, we added support for language packs and now the first language packs are available in the Marketplace.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

We will continue to work with the community to add more language packs.

Extension Recommendations

Extension Authoring

Add, remove and change workspace folders

The previously proposed API for adding, removing and changing workspace folders has been promoted to Stable.

Messages: isCloseAffordance no longer supported for non-modal messages

With the introduction of a new notification UI in this milestone, every notification message now provides a close button in the top-right corner. This change means that the close action is no longer mixed with other message actions and isCloseAffordance is no longer be needed for messages that are non-modal. Please look at your message usage and make sure that you are not adding an action to close the notification unless that action is doing something specific for your extension.

A message will still close automatically if any of the provided actions is clicked by the user.

New theme colors and removal of old colors

With the new notifications UX, new colors were added that theme authors should adopt:

All of the previously supported theme colors for notifications are no longer supported.

The border color of editor highlights can now also be freely chosen:

These additional colors were also added

Custom views

Themable item icons

If you want your TreeItem to have a folder or file icon from the active File Icon theme, you can assign the iconPath property of TreeIem to the ThemeIcon.Folder or ThemeIcon.File constant.

Tooltips

Extension uninstall hook

This script gets executed when the extension is completely uninstalled from VS Code which is when VS Code is restarted (shutdown and start) after the extension is uninstalled.

Note: Only Node.js scripts are supported.

Active view context key

Debug Adapter Protocol

New CapabilitiesEvent

Sometimes it is difficult for a debug adapter to know and return all capabilities from the (very early) Initialize request because some might not be known until the runtime/debugger has started. The newly introduced CapabilitiesEvent can be used at a later time to announce that one or more capabilities have changed. Since the capabilities are dependent on the frontend and its UI, it might not be possible to change that at random times (or too late). Consequently, the CapabilitiesEvent has a hint characteristic: a frontend can only be expected to make a ‘best effort’ in honoring individual capabilities, but there are no guarantees.

Language Server Protocol

Version 3.6.0 of the protocol specification is released. The version specifies the following new requests and notifications:

Engineering

Faster VS Code start-up by using asar

We are now packaging the core node_modules into an Electron Archive (asar) for faster start-ups by up to 5%. The file count on disk for a VS Code installation also gets reduced by approximately 25%.

Duplicate issue detection

The issue bot and the Issue Reporter UI run the new issue through duplicate detection and suggest candidates of existing issues.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Issue bot configuration by development phase

Proposed Extension APIs

This milestone we added several new proposed extension APIs. We plan to add these APIs to stable in a future milestone once we are confident enough with them. We welcome any feedback on how they work for your extension.

Note: These APIs are still proposed, so in order to use it, you must opt into it by adding a «enableProposedApi»: true to package.json and you’ll have to copy the vscode.proposed.d.ts into your extension project. Also be aware that you cannot publish an extension to the Marketplace that uses the enableProposedApi attribute.

Folding

New proposed API has been added to support language aware folding:

This is still work in progress, but feedback is welcome.

Editor Visible Ranges

New proposed API has been added to support reading an editor’s visible ranges:

Custom views: Reveal

More examples are here.

Webview API

The new webview API proposal seeks to make it easier to create and manage webviews. It supersedes the TextDocumentContentProvider and vscode.previewHtml command approach currently supported. We’re still working hard on this API and would love your feedback or suggestions.

The new webview API focuses on three areas:

First class

A webview is an editor that renders HTML content. It is conceptually similar to an iframe. You create a new webview using createWebview :

This creates and shows the new webview in the given editor group. Set the contents of the webview using the html property:

Passing messages between a webview and your extension is now also much simpler. To post a message to a webview, call postMessage in your extension:

And add a message handler inside the webview itself:

To post a message from a webview to your extension, call window.parent.postMessage inside the webview:

And add a onDidReceiveMessage event handler on the webview object in your extension:

Persistence

By default, a webview’s context is destroyed when it is no longer visible, such as when moved to a background tab. The context is automatically recreated once the webview is shown again. If your extension’s webview content cannot be quickly persisted and recreated, you can set the retainContextWhenHidden option. This preserves the webview’s context, even when the webview editor is in the background. This option should only be used when absolutely necessary as webviews have a high memory overhead.

Also, unlike the existing HTML previews, webviews do not reload when they are moved between editor groups.

Improved security

Webviews are also more secure than old HTML previews. By default, webviews do not allow scripts or command URIs, which can help protect your extension’s users from content injection attacks. You can enable scripts by setting enableScripts and enableCommandUris in the WebviewOptions when the webview is created.

Also, webviews now run in their own origin so they can no longer access file: resources directly. To load an extension resource, the webview must use the new vscode-extension-resource: URI scheme:

To load a resource from the user’s workspace, use the vscode-workspace-resource: scheme:

Preview Features

Preview features are not ready for release but are functional enough to use. We welcome your early feedback while they are under development.

Horizontal search

This feature is currently in preview since we plan to further improve the layout within the Search view to take advantage of the additional horizontal space. The work planned is captured in this issue so feel free to provide feedback in the issue directly.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

New Documentation

Node.js deployment tutorials for Azure Functions

We have a new Deploy to Azure using Azure Functions tutorial for creating and deploying serverless Azure Functions using the Azure Functions extension.

Refactoring topic

We added a dedicated Refactoring topic describing VS Code’s support for refactorings such as Extract Method, Extract Variable, and Rename Symbol.

New Commands

With the new notification commands, there are also new contexts for keybindings:

Note that notification toasts are never displayed when the notification Center is visible.

Notable Changes

Thank You

Last but certainly not least, a big Thank You! to the following folks that helped to make VS Code even better:

Contributions to vscode :

Contributions to vscode-eslint :

Contributions to language-server-protocol :

Contributions to vscode-languageserver-node :

Contributions to vscode-node-debug :

Contributions to vscode-node-debug2 :

Contributions to vscode-chrome-debug-core :

Contributions to vscode-css-languageservice :

Contributions to vscode-generator-code :

Contributions to localization :

This is the eleventh month since we opened community localization in Transifex. We now have over 700 members in the Transifex VS Code project team. We appreciate your contributions, either by providing new translations, voting on translations, or suggesting process improvements.

Here is a snapshot of top contributors for this release. For details about the project including the contributor name list, visit the project site at https://aka.ms/vscodeloc.

TypeScript tutorial in Visual Studio Code

TypeScript is a typed superset of JavaScript that compiles to plain JavaScript. It offers classes, modules, and interfaces to help you build robust components.

Install the TypeScript compiler

You can test your install by checking the version.

Hello World

Let’s start with a simple Hello World Node.js example. Create a new folder HelloWorld and launch VS Code.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Now add the following TypeScript code. You’ll notice the TypeScript keyword let and the string type declaration.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

IntelliSense

In VS Code, you can see that you get language features such as syntax highlighting and bracket matching. When you were typing in the editor, you may have noticed IntelliSense, the smart code completions and suggestions provided by VS Code and the TypeScript language server. Below you can see the methods of console

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

When you select a method, you then get parameter help and can always get hover information.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

tsconfig.json

So far in this tutorial, you have been relying on the TypeScript compiler’s default behavior to compile your TypeScript source code. You can modify the TypeScript compiler options by adding a tsconfig.json file that defines the TypeScript project settings such as the compiler options and the files that should be included.

Important: To use tsconfig.json for the rest of this tutorial, invoke tsc without input files. The TypeScript compiler knows to look at your tsconfig.json for project settings and compiler options.

Add a simple tsconfig.json that set the options to compile to ES5 and use CommonJS modules.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Change the build output

Having the generated JavaScript file in the same folder as the TypeScript source will quickly get cluttered on larger projects, so you can specify the output directory for the compiler with the outDir attribute.

Delete helloworld.js and run the command tsc with no options. You will see that helloworld.js is now placed in the out directory.

See Compiling TypeScript to learn about other features of the TypeScript language service and how to use tasks to run your builds directly from VS Code.

Error checking

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Quick Fixes

The TypeScript language service has a powerful set of diagnostics to find common coding issues. For example, it can analyze your source code and detect unreachable code which is displayed as dimmed in the editor. If you hover over the line of source code, you’ll see a hover explaining and if you place your cursor on the line, you’ll get a Quick Fix light bulb.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Clicking on the light bulb or pressing ⌘. (Windows, Linux Ctrl+. ) brings up the Quick Fix menu where you can select the Remove unreachable code fix.

Debugging

The debugger will start a session, run your code, and display the «Hello World» message in the Debug console panel.

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

Vs code install. Смотреть фото Vs code install. Смотреть картинку Vs code install. Картинка про Vs code install. Фото Vs code install

See Debugging TypeScript to learn more about VS Code’s built-in debugging support for TypeScript and how you can configure the debugger for your project scenarios.

Next steps

This tutorial was a quick introduction to using VS Code for TypeScript development. Read on to learn more about using VS Code’s compiling and debugging support for TypeScript:

Источники:

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *