Managing and configuring extensions

VS Code offers various types of extensions. Each extension is built for a specific purpose and requirement. In this topic, we will cover how you can browse, install, and manage extensions in your project. Once the VS Code is installed, you can open it by just typing code from the command prompt. You can then use the CLI (short for command-line interface) for different frameworks to create projects on the fly.

To open the Extensions bar, use the Ctrl + Shift + X command. This command opens the Extensions tab, as shown in the following screenshot, where you can search for any extension and add it to your editor:

Figure 2.1 – View of the Extensions bar

This bar categorizes extensions as ENABLED, RECOMMENDED, and DISABLED. All of the extensions that are currently installed are placed under the Enabled tab. Some new recommended extensions will be listed under the Recommended tab, while the Disabled tab shows the extensions that are currently disabled. You can search for new extensions by entering the extension name. When you search for extensions, you can see brief information about the extension identifier, publisher, description, downloads, rating, and links to its repository and license.

Important note

There are many extensions that are available, published by many developers and enterprises. One tip when choosing extensions is to make sure that the review or rating is good, or that the extension is from a trusted publisher.

Suppose I want to write code in C/C++. I can search for the extension by typing C++. It will list all of the extensions named C++, and you can choose the one that is from a trusted publisher. In our case, it is from Microsoft:

Figure 2.2 – Adding a C/C++ extension

The preceding screenshot shows the C/C++ extension published by Microsoft with more than 99 million downloads and a rating of 5 stars (on a scale of 1–5) and the links to its actual repository where you can see more information about the extension and contribute to it. Finally, the license information helps you understand whether it is free to use commercially or you need a paid license for it.

Extension packs

Extension packs are a collection of extensions that enable developers to easily install the related extensions with a single installation. For example, the Azure extension pack can be used when working with Azure resources in VS Code. With one single extension pack, you can work with Azure App Services, functions, Docker tools, storage, data, Visual Studio team services, Azure Terraform tools, IoT (internet of things) tools, AI (artificial Intelligence) tools, and many more.

Installing extensions from VSIX

In the previous section, we saw how extensions can be installed from the VS Code extensions marketplace. However, there are scenarios where the extension is available offline and we need to add it to the VS Code project. In this case, we can manually install the extension through a command-line option or from the VS Code Command Palette dialog.

Installing extensions from the CLI

To install extensions from the command line, we use the following syntax:

code --install-extension {path of extension VSIX file}

Here is an example of installing a custom extension packaged in a customextension.vsix file:

code --install-extension customextension.vsix

In the preceding instances, the command code is the CLI of VS Code editor and --install-extension is the switch that can be used to install extensions manually.

Installing extensions from the Command Palette

To install extensions from the Command Palette, select (…) from the Extensions bar and click on the Install from VSIX… option, as shown in the following screenshot:

Figure 2.3 – Context menu showing different extension options

It will ask you to browse for the VSIX file from your machine and then install it.

Extension information

If the extension is not an extension pack, then you can see the complete details about the extension, such as the contributions and changelog; otherwise, you will get two tabs, namely Details and Extension Pack. Here are the details of each tab.

Details provides adequate information about the extension in terms of getting started with the extension. It provides information about what is needed to use the extension, quick links, FAQs, known issues, guidelines to contributing, the code of conduct, and other details:

Figure 2.4 – Details of C/C++ for VS Code extension

Some of the extensions also show a Live Share icon. Live Share is a feature that allows multiple developers to collaborate and contribute to the same file from their own editor. We will be discussing this later in this book.

The Contributions tab shows the extension commands, settings, keyboard shortcuts, debuggers, and views that are required to understand and use the extension correctly.

The Changelog provides the complete history about the changes that were made in terms of improvements, new additions, and bug fixes, and how the extension evolved with time.

The Extension Pack section contains all of the extensions that are installed with the pack.