hubelbauer.net

For some reason the VS Code documentation doesn’t mention this on a dedicated page and this feature’s introduction and description is relegated only to the release notes of the version where it has shipped, so here I am summarizing my favorite VS Code feature and how I use it.

The feature is called Local Workspace Extensions and it was introduced in the 1.88 version of VS Code:

VS Code 1.88 release notes “Local Workspace Extensions” section

The way it works is you create a .vscode/extensions directory and then make a nested directory with your extension’s code in it. VS Code will treat that directory as if it was the contents of a VSIX extension package file either installed manually or using the VS Code extension marketplace.

When VS Code is reloaded and that directory exists with a proper package.json, it will prompt you to install that local workspace extension. You only need to do this once for the extension directory path, on subsequent reloads, the extension will remain installed.

VS Code will activate the extension and run its source code. If you make changes to the extension’s source code, you need to reload VS Code to make sure the changes get applied.

There is no hot reload.

You can reload VS Code using Cmd+Shift+P (Ctrl+Shift+P on Windows/Linux) and selecting Developer: Reload Window.

You can see the console.log statements the extension prints in the developer tools of VS Code found under Help > Toggle Developer Tools.

The extension can also write into the Output pane (it will appear in the picker at the top right of that pane) if it initializes its own output channel using the VS Code extension API.

The extensions can be written in TypeScript because VS Code now ships with a Node version that supports TypeScript out of the box.

The whole breadth of the VS Code extension API is available for the extension to use.