Creating a VS Code Extension

Pre-requisites

You need to have Node (npm and NodeJS) installed. Going through the Visual Studio Code API Documentation before trying this out also would be helpful.

Initiating

First, you have to install Yeoman and VS Code Extension Generator with the command below:

npm install -g yo generator-code

Then create a file directory for your new VS Code Extension and run the below command to generate the basic files for a VS Code Extension.

yo code

Some questions will be prompted during the process and you will have to input the necessary answers.

This is an example of prompted questions

A repository with some auto-generated files will be created inside the directory. Open the repo using VS Code. Now navigate to the “src/extension.ts” and check whether it has console.log saying “Hello World from <repoName>”.

Then select the “Run and Debug” tab on the left-hand side and it should have a “Run Extension” button on the top. If everything is right when you click on that it must open a new VS Code window, which runs the VS Code Extension you initiated.

Once the new window is opened press ‘Ctrl+Shift+P’ and it will open the commands tab. Type “Hello World” or select the command from the drop-down and it will give you a prompt that will confirm that your extension is working.

(at the bottom-left corner)

TaDaa! You have initiated developing your first VS Code Extension.

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store