How To Setup WSL on Windows 10 For Development

WSL is great to use if you are developing on Windows 10 - this is how you set it up.

2020-04-22 wsl

Enable WSL

First, you need to enable WSL. Run the following command in Windows PowerShell.

Enable-WindowsOptionalFeature -Online -FeatureName Microsoft-Windows-Subsystem-Linux

Install a distro from the Microsoft Store

Choose a distro from the Microsoft Store to install - I use Ubuntu.

Update Linux

First time you access your WSL, make sure to update everything.

sudo apt update

Customize the Command Line Prompt

You can make changes to how your prompt is displayed by modifying the .bashrc file. Add one of the following lines to modify your prompt.

export PS1="\w$ "               # full working dir
export PS1="\W$ "               # basename of working dir
export PS1="\u@\W $ "           # username @ working dir
export PS1="[\t] \u@\h:\w\$ "   # timestamp + username + host + working dir

Install Oh My Zsh

I always install Oh My Zsh in my linux environment.

sudo apt install zsh
sh -c "$(curl -fsSL https://raw.githubusercontent.com/ohmyzsh/ohmyzsh/master/tools/install.sh)"

You need to change your default shell to zsh if you want it to start when you access your ubuntu server.

chsh -s $(which zsh)

You can edit your zsh settings in the ~/.zshrc file. This file is basically like the .bashrc file for bash, so you need to add all of your .bashrc settings you want to have to this file.

nano ~/.zshrc

Plugins

You can define which plugins to use in the .zshrc file. I recommend installing some of these (you need to clone them to your WSL section first):

Installing my favourite plugins

# zsh-autosuggestions
git clone https://github.com/zsh-users/zsh-autosuggestions ${ZSH_CUSTOM:-~/.oh-my-zsh/custom}/plugins/zsh-autosuggestions

# zsh-syntax-highlighting
git clone https://github.com/zsh-users/zsh-syntax-highlighting.git ${ZSH_CUSTOM:-~/.oh-my-zsh/custom}/plugins/zsh-syntax-highlighting

After this, we just need to add our plugins to the plugins array in the .zshrc file.

plugins=(git zsh-syntax-highlighting zsh-autosuggestions)

Vs Code with WSL

You need to install the Remote WSL extension to use WSL in your VS Code environment.

Node.js and NPM in WSL

Often, you need to install Node and NPM to work with web development.

Bash install

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.35.3/install.sh | bash

Zsh install

Add nvm to your plugins in ~/zshrc.

plugins=(git zsh-syntax-highlighting zsh-autosuggestions nvm)

You might need to add this to your .zshrc file if it does not work.

export NVM_DIR=~/.nvm
[ -s "$NVM_DIR/nvm.sh" ] && . "$NVM_DIR/nvm.sh"

Node installation

Now, use nvm to install Node.

nvm install 14.16.1

Setup Git

First, install the latest version of Git.

sudo apt install git

Add your credentials.

git config --global user.name "<name here>"
git config --global user.email "<email here>"

Docker

To install and setup Docker, refer to my other guide here.

Modify WSL configurations

If you are running Windows 10 18.03+ or newer, it might be good to make some changes. sudo nano /etc/wsl.conf to edit your configurations file.

[automount]
root = /
options = "metadata"

This will allow you to work from /c instead of /mnt/c, and also fixes some of your permissions. You need to sign out of Windows to make this work.