Visual studio code cli что это
Командная строка разработчика и PowerShell для разработчиков в Visual Studio
В Visual Studio 2019 есть две оболочки командной строки для разработчиков:
Командная строка разработчика для Visual Studio — стандартная командная строка с определенными переменными среды, упрощающая работу с инструментами разработки. Доступно с версии Visual Studio 2015.
PowerShell для разработчиков Visual Studio — более функциональное средство, чем командная строка. Например, в нем можно передать результат одной команды (называемой cmdlet ) в другой cmdlet. В этой оболочке доступны те же переменные среды, что и в Командной строке разработчика. Доступно с версии Visual Studio 2019.
Начиная с версии 16.5, в Visual Studio 2019 доступен встроенный терминал, где можно работать как с Командной строкой разработчика, так и с PowerShell для разработчиков. Можно открыть несколько вкладок для каждой оболочки. Терминал Visual Studio построен на основе Терминала Windows. Чтобы открыть терминал в Visual Studio, выберите элементы Вид > Терминал.
При запуске в Visual Studio одной из оболочек как отдельного приложения или в окне терминала открывается каталог текущего решения (если оно загружено). Это упрощает выполнение команд для решения или его проектов.
В обеих оболочках заданы определенные переменные среды. Это упрощает работу с инструментами командной строки. Открыв эти оболочки, можно выполнять команды для различных служебных программ, не указывая их расположения.
Запуск в Visual Studio
Выполните следующие действия, чтобы открыть в Visual Studio Командную строку разработчика или PowerShell для разработчиков:
Запустите Visual Studio.
В строке меню выберите элементы Инструменты > Командная строка > Командная строка разработчика или PowerShell для разработчиков.
Запуск из меню Windows
Другой способ запуска оболочек — из меню «Пуск». В зависимости от версии Visual Studio, дополнительно установленных пакетов SDK и рабочих нагрузок может иметься несколько вариантов командных строк.
Windows 10
Разверните папку Visual Studio 2019.
Выберите вариант Developer Command Prompt for VS 2019 (Командная строка разработчика для VS 2019) или Developer PowerShell for VS 2019 (PowerShell для разработчиков для VS 2019).
Кроме того, вы можете начать вводить имя оболочки в поле поиска на панели задач и выбрать нужный результат, так как в списке результатов начнут отображаться найденные совпадения.
Windows 8.1
На начальном экране нажмите Ctrl+Tab, чтобы открыть список приложений, а затем нажмите V. Появится список, включающий все установленные командные строки Visual Studio.
Выберите вариант Developer Command Prompt for VS 2019 (Командная строка разработчика для VS 2019) или Developer PowerShell for VS 2019 (PowerShell для разработчиков для VS 2019).
Windows 7
Выберите Пуск а затем разверните Все программы.
Если установлены другие пакеты SDK, например, пакет SDK для Windows 10 или предыдущих версий, могут появиться дополнительные командные строки. Требуемая версия командной строки указана в документации по соответствующим инструментам.
Запуск из обозревателя файлов
Обычно ярлыки для установленных оболочек помещаются в папку меню «Пуск» для Visual Studio, например в %ProgramData%\Microsoft\Windows\Start Menu\Programs\Visual Studio 2019\Visual Studio Tools. Но если поиск командной строки не дает ожидаемых результатов, попробуйте вручную найти нужные файлы на компьютере.
Командная строка разработчика
Выполните поиск файла командной строки (VsDevCmd.bat) или перейдите в папку «Инструменты» Visual Studio ( %ProgramFiles(x86)%\Microsoft Visual Studio\2019\Community\Common7\Tools — путь зависит от версии Visual Studio, выпуска и расположения установки).
Когда вы найдете файл командной строки, откройте его. Для этого введите следующую команду в стандартном окне командной строки:
Кроме того, вы можете ввести следующую команду в диалоговом окне Windows Выполнить:
Вам необходимо изменить путь в соответствии с расположением установки Visual Studio.
PowerShell для разработчиков
Найдите файл скрипта PowerShell с именем Launch-VsDevShell.ps1 или перейдите в папку «Инструменты» Visual Studio ( %ProgramFiles(x86)%\Microsoft Visual Studio\2019\Community\Common7\Tools). Путь зависит от версии, выпуска и расположения установки Visual Studio. После этого выполните следующую команду в командной строке Windows PowerShell или PowerShell 6:
По умолчанию PowerShell для разработчиков запускается с конфигурацией для той версии Visual Studio, путь установки к которой указан в файле Launch-VsDevShell.ps1.
Чтобы выполнить cmdlet, нужно задать политику выполнения.
Сниппет, расширение для VSCode и CLI. Часть 1
Доброго времени суток, друзья!
В процессе разработки Современного стартового HTML-шаблона я задумался о расширении возможностей его использования. На тот момент варианты его применения ограничивались клонированием репозитория и скачиванием архива. Так появились HTML-сниппет и расширение для Microsoft Visual Studio Code — HTML Template, а также интерфейс командной строки — create-modern-template. Конечно, указанные инструменты далеки от совершенства и я буду их дорабатывать по мере сил и возможностей. Однако, в процессе их создания я узнал несколько интересных вещей, которыми и хочу с вами поделиться.
В этой части мы рассмотрим сниппет и расширение, а CLI — в следующей.
Если вас интересует лишь исходный код, вот ссылка на репозиторий.
Сниппет (Snippet)
Что такое сниппет? Если коротко, сниппет — это заготовка, которую использует редактор для автозаполнения (автодополнения кода).
Потренируемся создавать JS-сниппеты. Находим файл javascript.json и открываем его.
Видим комментарии, кратко описывающие правила создания сниппетов. Более подробную информацию о создании пользовательских сниппетов в VSCode можно найти здесь.
Начнем с чего-нибудь простого. Создадим сниппет для console.log(). Вот как он выглядит:
Создадим сниппет для цикла for-of:
с выделенным item. Нажимаем Tab, выделяется arr. Еще раз нажимаем Tab, переходим на вторую строку.
Вот еще несколько примеров:
HTML-сниппеты строятся по такому же принципу. Вот как выглядит HTML Template:
Набираем html, нажимаем Tab или Enter, получаем разметку. Положения курсора определены в следующем порядке: название приложения (title), описание (description), автор (author), ключевые слова (keywords), адрес (url).
Расширение (Extension)
На сайте VSCode имеется отличная документация по созданию расширений.
Мы создадим два варианта расширения: в форме сниппетов и в форме CLI. Второй вариант опубликуем в Visual Studio Marketplace.
Примеры расширений в форме сниппетов:
Расширение в форме сниппетов
Для разработки расширений для VSCode, нам, кроме Node.js и Git, потребуется еще парочка библиотек, точнее, одна библиотека и плагин, а именно: yeoman и generator-code. Устанавливаем их глобально:
Выполняем команду yo code, выбираем New Code Snippets, отвечаем на вопросы.
Осталось скопировать созданный нами ранее HTML-сниппет в файл snippets/snippets.code-snippets (файлы сниппетов также могут иметь расширение json), отредактировать package.json и README.md, и можно публиковать расширение в маркетплейсе. Как видите, все очень просто. Слишком просто, подумал я, и решил создать расширение в форме CLI.
Расширение в форме CLI
Снова выполняем команду yo code. На этот раз выбираем New Extension (TypeScript) (не бойтесь, TypeScript в нашем коде почти не будет, а там, где будет, я дам необходимые разъяснения), отвечаем на вопросы.
Для того, чтобы убедиться в работоспособности расширения, открываем проект в редакторе:
Нажимаем F5 или на кнопку Run (Ctrl/Cmd+Shift+D) слева и кнопку Start Debugging сверху. Иногда при запуске можно получить ошибку. В этом случае отменяем запуск (Cancel) и повторяем процедуру.
Получаем информационное сообщение от VSCode и соответствующее сообщение (поздравление) в консоли.
Из всех файлов, имеющихся в проекте, нас интересуют package.json и src/extension.ts. Директорию src/test и файл vsc-extension-quickstart.md можно удалить.
Заглянем в extension.ts (комментарии удалены для удобочитаемости):
Важный момент: ‘расширение.команда’ в extension.ts должно совпадать со значениями полей activationEvents и command в package.json:
Мы хотим, чтобы наше расширение по функционалу напоминало create-react-app или vue-cli, т.е. по команде create создавало проект, содержащий все необходимые файлы, в целевой директории.
Для начала отредактируем package.json:
Создаем директорию src/components для хранения файлов проекта, которые будут копироваться в целевую директорию.
Создаем файлы проекта в виде ES6-модулей (VSCode по умолчанию использует ES6-модули (export/import), но поддерживает и CommonJS-модули (module.exports/require)): index.html.js, css/style.css.js, script.js и т.д. Содержимое файлов экспортируется по умолчанию:
Обратите внимание, что при таком подходе все изображения (в нашем случае, иконки) должны быть закодированы в Base64: вот один из подходящих онлайн-инструментов. Наличие строки «data:image/png;base64,» в начале преобразованного файла принципиального значение не имеет.
Для копирования (записи) файлов мы будем использовать fs-extra. Метод outputFile данной библиотеки делает томе самое, что и встроенный Node.js-метод writeFile, но также создает директорию для записываемого файла при ее отсутствии: например, если мы указали создать css/style.css, а директории css не существует, outputFile создаст ее и запишет туда style.css (writeFile при отсутствии директории выбросит исключение).
Файл extension.ts выглядит следующим образом:
Для того, чтобы TypeScript не обращал внимания на отсутствие типов импортируемых файлов-модулей, создадим src/global.d.ts следующего содержания:
Протестируем расширение. Открываем его в редакторе:
Запускаем отладку (F5). Переходим в целевую директорию (test-dir, например) и выполняем команду create в Command Palette.
Получаем информационное сообщение об успешном создании файлов. Ура!
Публикация расширения в Visual Studio Marketplace
Для того, чтобы иметь возможность публиковать расширения для VSCode, необходимо сделать следующее:
Выполняем команду vsce package в директории расширения для создания публикуемого пакета с расширением vsix. Получаем файл htmltemplate-1.0.0.vsix.
На странице управления расширениями маркетплейса нажимаем кнопку New extension и выбираем Visual Studio Code. Переносим или загружаем в модальное окно VSIX-файл. Ждем завершения проверки.
После того, как рядом с номером версии появилась зеленая галочка, расширение становится доступным для установки в VSCode.
Для обновления расширения необходимо изменить номер версии в package.json, сгенерировать VSIX-файл и загрузить его в маркетплейс, нажав на кнопку More actions и выбрав Update.
Как видите, в создании и публикации расширений для VSCode нет ничего сверхестественного. На этом позвольте откланяться.
В следующей части мы создадим полноценный интерфейс командной строки сначала с помощью фреймворка от Heroku — oclif, затем без него. Наш Node.js-CLI будет сильно отличаться от расширения, в нем будет присутствовать некоторая визуализация, возможность опциональной инициализации git и установки зависимостей.
Надеюсь, вы нашли для себя что-нибудь интересное. Благодарю за внимание.
Command Line Interface (CLI)
Visual Studio Code has a powerful command-line interface built-in that lets you control how you launch the editor. You can open files, install extensions, change the display language, and output diagnostics through command-line options (switches).
If you are looking for how to run command-line tools inside VS Code, see the Integrated Terminal.
Command line help
Launching from command line
Note: Users on macOS must first run a command (Shell Command: Install ‘code’ command in PATH) to add VS Code executable to the PATH environment variable. Read the macOS setup guide for help.
Core CLI options
Here are optional arguments you can use when starting VS Code at the command line via code :
Opening Files and Folders
Sometimes you will want to open or create a file. If the specified file does not exist, VS Code will create them for you along with any new intermediate folders:
If you specify more than one file at the command line, VS Code will open only a single instance.
If you specify more than one folder at the command line, VS Code will create a Multi-root Workspace including each folder.
Working with extensions
You can install and manage VS Code extensions from the command line.
Advanced CLI options
There are several CLI options that help with reproducing errors and advanced setup.
Opening VS Code with URLs
You can also open projects and files using the platform’s URL handling mechanism. Use the following URL formats to:
Open a file to line and column
You can use the URL in applications such as browsers or file explorers that can parse and redirect the URL. For example, on Windows, you could pass a vscode:// URL directly to the Windows Explorer or to the command line as start vscode://
Next steps
Read on to find out about:
Common questions
‘code’ is not recognized as an internal or external command
Your OS cannot find the VS Code binary code on its path. The VS Code Windows and Linux installations should have installed VS Code on your path. Try uninstalling and reinstalling VS Code. If code is still not found, consult the platform-specific setup topics for Windows and Linux.
On macOS, you need to manually run the Shell Command: Install ‘code’ command in PATH command (available through the Command Palette ⇧⌘P (Windows, Linux Ctrl+Shift+P ) ). Consult the macOS specific setup topic for details.
How do I get access to a command line (terminal) from within VS Code?
VS Code has an Integrated Terminal where you can run command-line tools from within VS Code.
Can I specify the settings location for VS Code in order to have a portable version?
Not directly through the command line, but VS Code has a Portable Mode, which lets you keep settings and data in the same location as your installation, for example, on a USB drive.
Предварительные требования
Создание приложения
Запустите Visual Studio Code.
В главном меню выберите Файл > Открыть папку (в macOS выберите File > Open. (Файл > Открыть)).
В диалоговом окне Открыть папку создайте папку HelloWorld и выберите ее. Затем щелкните Выбрать папку (или Открыть в macOS).
В диалоговом окне о доверии авторам файлов в этой папке выберите Да, я доверяю авторам.
Откройте терминал в Visual Studio Code, выбрав в основном меню пункт Вид > Терминал.
Откроется окно Терминал с командной строкой в папке HelloWorld.
В окне терминала введите следующую команду:
Шаблон проекта создает простое приложение, которое отображает «Hello World» в окне консоли, вызывая метод Console.WriteLine(String) из файла Program.cs.
Замените содержимое Program.cs кодом из этого примера.
При первом редактировании файла .cs в Visual Studio Code будет предложено добавить недостающие ресурсы для сборки и отладки приложения. Выберите Да и Visual Studio Code создаст папку .vscode с файлами launch.json и tasks.json.
Запуск приложения
Выполните следующие команды в окне терминала:
В программе отобразится сообщение «Hello World!», после чего она завершится.
Улучшение приложения
Давайте расширим приложение. Теперь у пользователя будет запрашиваться имя, которое затем будет отображаться с датой и временем.
Откройте файл Program.cs.
В Program.cs замените содержимое метода Main (строка, вызывающая Console.WriteLine ) следующим кодом:
NewLine — это независимый от платформы и языка способ для представления разрыва строки. Его альтернативами являются \n в C# и vbCrLf в Visual Basic.
В Visual Studio Code необходимо явно сохранить изменения. В отличие от Visual Studio, изменения файлов не сохраняются автоматически при сборке и запуске приложения.
Запустите программу еще раз:
Нажмите любую клавишу для выхода из программы.
Дополнительные ресурсы
Следующие шаги
Предварительные требования
Создание приложения
Запустите Visual Studio Code.
В главном меню выберите Файл > Открыть папку (в macOS выберите File > Open. (Файл > Открыть)).
В диалоговом окне Открытие папки создайте папку HelloWorld и щелкните Выбрать папку (в macOS щелкните Open (Открыть)).
Откройте терминал в Visual Studio Code, выбрав в основном меню пункт Вид > Терминал.
Откроется окно Терминал с командной строкой в папке HelloWorld.
В окне терминала введите следующую команду:
Этот шаблон создает простое приложение Hello World. Он вызывает метод Console.WriteLine(String) для вывода » Hello World! » в окне консоли.
Main — точка входа в приложение. Это метод, который автоматически вызывается средой выполнения при запуске приложения. Все аргументы, предоставленные в командной строке при запуске приложения, доступны через массив args.
Запуск приложения
Выполните следующие команды в окне терминала:
В программе отобразится сообщение «Hello World!», после чего она завершится.
Улучшение приложения
Давайте расширим приложение. Теперь у пользователя будет запрашиваться имя, которое затем будет отображаться с датой и временем.
Откройте файл Program.cs, щелкнув его.
Когда вы в первый раз открываете файл C# в Visual Studio Code, в редакторе загружается OmniSharp.
Когда в Visual Studio Code будет предложено добавить недостающие ресурсы для сборки и отладки приложения, выберите Да.
В Program.cs замените содержимое метода Main (строка, вызывающая Console.WriteLine ) следующим кодом:
NewLine — это независимый от платформы и языка способ для представления разрыва строки. Его альтернативами являются \n в C# и vbCrLf в Visual Basic.
В Visual Studio Code необходимо явно сохранить изменения. В отличие от Visual Studio, изменения файлов не сохраняются автоматически при сборке и запуске приложения.
Запустите программу еще раз:
Нажмите любую клавишу для выхода из программы.
Дополнительные ресурсы
Следующие шаги
My Top 8 Visual Studio Code Tips and Features
Visual Studio Code has become one of the most used and loved Text Editors in recent years. Here are some statistics from the 2018 Stackoverflow Survey:- Most Popular Development Environments. Source: https://insights.stackoverflow.com/survey/2018/
1. Visual Studio Code CLI
Visual Studio Code comes with an inbuilt Command Line Interface. Once you’ve installed Visual Studio Code, and have it open, press ⇧⌘P to open the command palette for Mac, or just ⌘P and the press > button.
Table of Contents
, Visual Studio Code will open with the directory represented by Path.
Ever wanted to see the difference between two files, Let’s look at an example. Here are two files with a slight difference in them.
app1.js
app2.js
This is a small file, and we can see the diff right away. But for demonstration purposes, we’ll type in the following in the command line.
This opens Visual Studio Code with the following View.
We can see where the diff in the two files is. This is the same view that’s available when you are looking at Git Diff, with the integrated Git Support in Visual Studio Code.
2. Git Integration
Sometimes using Git can be fun or hard, but Visual Studio Code comes with integrated Git that allows for Adding, Committing, Pulling and Pushing Changes to a remote Git repository using a simple GUI.
Let’s go through a simple workflow that will involve the following steps.
We have the two files we created app1.js and app2.js. Let’s initialize a git repository in this directory. And then open Visual Studio Code with this directory.
You’ll immediately notice that Git is active in the left most pane. It has a badge with 2 on it.
The two files have a U in on their right, which means they are untracked. If you click on the git Icon with a badge of 2, you get this view. Hover over the first file app1.js, and these icons appear
The + sign is an equivalent of git add command. click it. and the view changes to this.
Now, there’s a new entry in Changes section with the same file. When you click on the file app1.js in the Changes Section, you will see a diff displayed, like we saw in topic 1.
Other helpful features that are git related include
We see useful commands that are sometimes quite hard to grasp.
At the bottom of Visual Studio Code, in the status bar, you can also see the branch you are currently in. Clicking on that branch allows you to select any other branches that exist.
When you click on that, a list of branches appears in the search panel, with the first option being the ability to create a new branch
3. Debugging
Visual Studio Code has a rich API for enabling debugging tools, Here are some articles here in scotch referencing them.
Debugging is a large topic, and is usually language/stack specific. Depending on the language you are using, there are available plugins that enable support for debugging, and you’ll be able to use breakpoints to debug your code when developing.
4. Live Share
Visual Studio Code Live Share is a feature that enables you to share your VS Code instance, and allow someone remote to control and run other things such as debuggers.
Live Share is published as a plugin, and is currently in Preview.
All that is required is for you to install the plugin, and the status bar will enable you share any working session by getting a link, once you are signed in.
5. Split Views, Zen Mode
There are a couple of built in Editor Layouts that you can view by going to the View > Editor Layout menu.
Below shows the 2×2 Grid Option
Below shows the zen mode. Notice my code has been centered, and all other VS Code visuals removed.
6. Helpers (Intellisense, Context Menus..)
I decide to call this section helpers because it consists of little things that are quite helpful when writing code.
Here’s a simple JavaScript file we’ll use to demonstrate these features.
VS Code has a couple of helpers for NPM. First of all, when you are creating the scripts, there’s beautiful intellisense and you can just select the script you want. Next, there’s a NPM SCRIPTS panel on the left, usually at the bottom, which will list the package.json file, and within it the scripts. Right clicking on the file, gives you an option to run npm install
. And Hovering over the particular script displays a Play button which will allow you run the script.
Take for instance the piece of code we had earlier, if you open the file, and go to the Outline section on the left pane, you’ll see this We see an outline of the main blocks of our code, and clicking on any of them, takes the editor focus to that section of the code.
These are just a few features and tips I didn’t know hot to categories. 😉
7. Integrated Terminal
Most of the time when running code, there’s usually a terminal open either to the side, or somewhere in your machine.
8. Plugins and Themes
Visual Studio Code has a rich plugin API, and this has enabled developers to create really awesome plugins. I’ll list a few common ones which I’ve used, but to get a comprehensive list, you can look at the Visual Studio Code Marketplace. Themes can be found here
Conclusion: Visual Studio Code can do that.
Visual Studio Code is a good Editor, that can adapt to many languages and technologies out there, and discovering these little helpers can sometimes take time.
Lucky for us, two awesome developers, @burkeholland and @sarah_edo created Visual Studio Code Can Do That site, that lists some awesome features and things you can do with Visual Studio Code.