DEV Community

Jonathan Creamer
Jonathan Creamer

Posted on • Originally published at jonathancreamer.com on

Setting up WSL2 and the VSCode Remote Containers WSL Plugin

Setting up WSL2 and the VSCode Remote Containers WSL Plugin

For years, macOS has been the gold standard for tooling when it comes to Web Development. The unix basis of macOS, iTerm, bash, VIM, etc are all things that folks building for the web platform rely on day to day.

That all changes with WSL2.

WSL2 allows web dev folks working in Windows to get the same goodness of macOS's unix based tooling running "more natively" on Windows.

Read more about how all this works:

Steps to install WSL2

Step 1

Turn on WSL in a command prompt or Powershell.

dism.exe /online /enable-feature /featurename:Microsoft-Windows-Subsystem-Linux /all /norestart
Enter fullscreen mode Exit fullscreen mode

Step 2

Enable the Virtual Machine Platform

dism.exe /online /enable-feature /featurename:VirtualMachinePlatform /all /norestart
Enter fullscreen mode Exit fullscreen mode

Probably should restart after this.

Step 3

Install this X64 Patch.

Step 4

Make sure WSL2.0 is default.

wsl --set-default-version 2
Enter fullscreen mode Exit fullscreen mode

Step 4

Install Linux!

Go to the Windows Store, and find your favorite Linux.

e.g. Ubuntu 20, Alpine Linux

Optional other good stuff

That's it for WSL2 install, but there's more goodness you can get with...

Install Windows Terminal

Windows Terminal is a brilliant app that manages all kinds of command prompts, terminals, etc. Read more about how to make Powershell Pretty.

Setting up WSL2 and the VSCode Remote Containers WSL Plugin

By default it will work with Command Prompt and Powershell, but once you have WSL, and Linux installed, it'll also allow you to open Terminals straight into your Linux!

Install Docker Desktop

Installing Docker Desktop allows you to install a new WSL2 based backend that speeds up working with Docker on Windows, adds a nice GUI on top of Docker that allows you to see your running containers visually, installs all the command line tools for docker like docker-compose, and allows you to install a small kubernetes cluster as well.

Setting up WSL2 and the VSCode Remote Containers WSL Plugin

Read more here.

VSCode Remote Containers

Step 1

Install the Remote Containers - WSL plugin.

Step 2

Clone a Repo, or something in your Linux Distro.

Setting up WSL2 and the VSCode Remote Containers WSL Plugin

Step 3

Use the Command Palette (Control + Shift + P) and search for Remote-WSL to Open a Folder.

Setting up WSL2 and the VSCode Remote Containers WSL Plugin

Choose the folder you want, and VSCode will now open the project connected directly to your Linux Distro.

Setting up WSL2 and the VSCode Remote Containers WSL Plugin

Alternatively you can navigate to the repo in Terminal, and use code . which will also open VSCode connected directly to the Linux Distro.

Conclusion

This post tried to be as clear and concise along the way to get up and running with WSL2 and VSCode as quick as possible. It's a huge productivity win for Web Dev folks working on Windows to be able to develop against Linux, so hopefully this will help accelerate those gains.

BONUS PROTIP

You can also install the Remote - Containersplugin and test out different programming languages with the power of Docker.

Setting up WSL2 and the VSCode Remote Containers WSL Plugin

Setting up WSL2 and the VSCode Remote Containers WSL Plugin

Discussion (0)