How to install extensions in VSCode

In order to become more productive, every developer should have their own tooling and setup. Having the right tools can save you hours of debugging, helps you write cleaner, more readable code. VSCode extensions allow you to add tools, languages, debuggers, and more, to help you do just that.

This article is going to show you how to install VSCode extensions online from Visual Studio Code Marketplace as well as offline with a VSIX file.

Access VSCode Marketplace

In order to access extensions from within VSCode, look at the left sidebar (Activity Bar) where you will see the Extension button image-20210525141332485. Clicking it will bring up the Extension sidebar.

Alternatively, you can fire up VSCode Command Palette and search for View: Extensions command to open VSCode Marketplace (or press Ctrl+Shift+X, which is its default shortcut).

After that, you will be presented with several lists: extensions that you've installed, popular extensions and recommended extensions based on what you've installed.

image-20210525151741895

Each extension in the sidebar includes a snippet of the description, the publisher name, version number and a quick install button. Clicking on the extension name will bring you to its details page where you can find more information about it.

Install extension from the Marketplace

  1. To be able to install an extension, you must find it first. In order to do that, you can use the search box on top of the Extension sidebar. The suggested extensions will show up as you type in the name.

  2. In the example below, we're going to install Text Pastry - an extensions that makes it easier to do bulk changes to text files.

image-20210525152633669
  1. You can either click the Install button in the sidebar or in the extension details page. Once the installation completed, a gear button will takes place of the Install button, allows you to configure or disable it.

Install extension from VSIX file (offline installation)

VSCode is an open source editor with Microsoft components layered on top. Microsoft's addition includes telemetry, gallery, marketplace, etc. which makes VSCode a "product".

What that means is VSCode included a way to install extensions locally in the form of VSIX file. This allows for offline installation as well as extensions which are not originated from VSCode Marketplace.

In fact, Eclipse Foundation has released Open VSX Registry to be a vendor-neutral open-source alternative to the Visual Studio Marketplace. You can also download VSIX packages of extensions directly VSCode Marketplace if needed.

image-20210525155840262

In order to install downloaded VSIX files, click the three-dots button in Extension sidebar and select Install from VSIX....

image-20210525160148991

After that, browse to the VSIX file and select it. Voila, now the extension has been installed.

FAQ

  1. Can you install a VSCode extension offline?

    Yes, but you need to download the extension packaged in VSIX format first.

  2. Where can I find VSIX files?

    You can find VSIX files of VSCode packages in Open VSX or VSCode Marketplace itself.

  3. Is there any difference between VSIX packages and extensions installed from Marketplace?

    No, they are just two forms of the same extension.

Click to rate this post!
[Total: 18 Average: 5]

Leave a Comment