UnitedWithCode/terminal-setup.md

## terminal-setup.md

      
    Raw
  

              terminal-setup.md
            
          
    Setting up a decent looking Windows Terminal with Oh-my-Posh that works with WSL and integrate it in VSCode and IntelliJ

This is a briefly summary of what I did to set up my Windows Terminal for Powershell on the Windows side and Zsh on the WSL(Ubuntu) side and integrate it in VSCode and IntelliJ.

    
Powershell and Windows Terminal

Let's begin by setting up powershell and the Windows Terminal.
Installation of required packages

Optional: Upgrading PowerShellGet and PackageManagement

Fell free to skip this part. I just wanted to make sure everything is up to date.


Run Powershell as administrator


Install the newest NuGet version
> Install-PackageProvider Nuget -Force


Install the newest version of PowerShellGet and PackageManagement
> Install-Module -Name PowerShellGet -Force
> Install-Module -Name PackageManagement -Force


Remove the previous versions by deleting the respective folders in the installation path. The following command will show all available powershell packages with their version and their installation path:
> Get-Module -ListAvailable


Install Terminal-Icons

Install Terminal-Icons via PowerShellGet to get some nice looking icons for the ls output:
> Install-Module -Name Terminal-Icons
Install posh-git

Install posh-git via PowerShellGet for git command autocompletion:
> Install-Module -Name posh-git
Install Oh-my-Posh

You can easily install Oh-my-Posh via winget:
> winget install JanDeDobbeleer.OhMyPosh
For other installation methods check out the docs.
Install a Powerline Font

Install a powerline font, so that glyphs used in oh-my-posh themes are rendered correctly. Nerdfonts has a decent selection of fonts. I am using the Caskaydia Cove Nerd Font and Meslo Font but feel free to choose what suits your needs.
Setup

Now that we have installed all required packages we can start with the setup.
Oh-my-Posh Theme

You can use one of the default themes that you can install with
> Get-PoshThemes
create your own theme (take a look in the documentation) or use my theme. Make sure to provide the path to your theme in your powershell profile:
Powershell Profile

Open the Powershell Profile for the current user or create one under ~\Documents\WindowsPowerShell\Microsoft.PowerShell_profile.ps1 if it does not exist and add the following:
# Importing Powershell Packages to the current session
Import-Module PackageManagement
Import-Module PowerShellGet
Import-Module Terminal-Icons
Import-Module posh-git

# Oh-my-posh Setup
oh-my-posh --init --shell pwsh --config "path to oh-my-posh theme" | Invoke-Expression

# Tweaked PSReadLine Colors to fit my color scheme
# Feel free to change it :)
Set-PSReadLineOption -Colors @{
  Command  = 'Green'
  Comment  = 'DarkGray'
  Variable = 'Magenta'
  Keyword  = 'Magenta'
}
Windows Terminal Settings

Add the following json snippets to the Windows Terminal settings to mimic my settings. Of course you can change everything to your needs.
Hint: Do not copy the comments, cause json don't support them. I just added them for explanation purposes 🙃
// Set powershell as default shell
{
	"defaultProfile": "Enter guid of Windows Powershell to set Powershell as default shell"
}
// Set default appereance
{
	"profiles": {
		"defaults": {
			"acrylicOpacity": 0.90000000000000002,
			"colorScheme": "ColorOne",
			"font": {
				"face": "CaskaydiaCove NF",
				"size": 12,
				"weight": "normal"
			},
			"useAcrylic": false
		}
	}
}
// Add color scheme
{
	"schemes": [
		{
			"background": "#282C34",
			"black": "#282C34",
			"blue": "#0078FF",
			"brightBlack": "#5A6374",
			"brightBlue": "#0078FF",
			"brightCyan": "#4FB2FF",
			"brightGreen": "#39FA73",
			"brightPurple": "#A140FC",
			"brightRed": "#ED3E4E",
			"brightWhite": "#F2F2F2",
			"brightYellow": "#F1F139",
			"cursorColor": "#FFFFFF",
			"cyan": "#4FB2FF",
			"foreground": "#F2F2F2",
			"green": "#39FA73",
			"name": "ColorOne",
			"purple": "#A140FC",
			"red": "#ED3E4E",
			"selectionBackground": "#FFFFFF",
			"white": "#F2F2F2",
			"yellow": "#F1F139"
		}
	]
}
WSL

Now that we have set up powershell and the Windows Terminal we can set up zsh and oh-my-posh for WSL.
^{PS: I am using Ubuntu, but the steps should be replicatible when using other distros.}
Installation of required packages

Install Zsh

> sudo apt install zsh
Install Zsh Syntax Highlighting

> git clone https://github.com/zsh-users/zsh-syntax-highlighting.git ~/.zsh/zsh-syntax-highlighting
Install Oh-my-Posh

Download Oh-my-Posh from github:
> wget https://github.com/JanDeDobbeleer/oh-my-posh/releases/latest/download/posh-linux-amd64 -O /usr/local/bin/oh-my-posh
and make it executable:
> chmod +x /usr/local/bin/oh-my-posh
Setup

Zsh Config

Create a .zshrc file in your homediretory and add or append the following lines in order to clone my settings. Again fell free to change everything.
# Enable colors for available commands
alias ls='ls --color=auto'
alias grep='grep --color=auto'
alias fgrep='fgrep --color=auto'
alias egrep='egrep --color=auto'
alias diff='diff --color=auto'
alias ip='ip --color=auto'

# Oh-my-posh Setup
eval "$(oh-my-posh init zsh --config "path to oh-my-posh theme")"

# Import Zsh Syntax Highlighting
source ~/.zsh/zsh-syntax-highlighting/zsh-syntax-highlighting.zsh

# Adjusted Zsh syntax highlighting colors
ZSH_HIGHLIGHT_STYLES[unknown-token]=fg=007
ZSH_HIGHLIGHT_STYLES[single-quoted-argument]=fg=006
ZSH_HIGHLIGHT_STYLES[double-quoted-argument]=fg=006
ZSH_HIGHLIGHT_STYLES[single-hyphen-option]=fg=008
ZSH_HIGHLIGHT_STYLES[double-hyphen-option]=fg=008
ZSH_HIGHLIGHT_STYLES[comment]=fg=008
ZSH_HIGHLIGHT_STYLES[function]=fg=006
ZSH_HIGHLIGHT_STYLES[reserved-word]=fg=005
ZSH_HIGHLIGHT_STYLES[commandseparator]=fg=005
ZSH_HIGHLIGHT_STYLES[redirection]=fg=005

Set Zsh as the default shell

Use the following command to set Zsh as the default shell:
sudo chsh -s $(which zsh)
VSCode Integration

These are the json snippets I added to my VSCode settings, so that the integrated VSCode Terminal matches with the Windows Terminal:
// Set font
{
	"terminal.integrated.fontFamily": "MesloLGM NF",
	"terminal.integrated.fontSize": 14
}
// Add Color Scheme
{
	"workbench.colorCustomizations": {
		"terminal.foreground": "#F2F2F2",
		"terminal.ansiBlack": "#282C34",
		"terminal.ansiBlue": "#0078FF",
		"terminal.ansiCyan": "#4FB2FF",
		"terminal.ansiGreen": "#39FA73",
		"terminal.ansiMagenta": "#A140FC",
		"terminal.ansiRed": "#ED3E4E",
		"terminal.ansiWhite": "#F2F2F2",
		"terminal.ansiYellow": "#F1F139",
		"terminal.ansiBrightBlack": "#5A6374",
		"terminal.ansiBrightBlue": "#0078FF",
		"terminal.ansiBrightCyan": "#4FB2FF",
		"terminal.ansiBrightGreen": "#39FA73",
		"terminal.ansiBrightMagenta": "#A140FC",
		"terminal.ansiBrightRed": "#ED3E4E",
		"terminal.ansiBrightWhite": "#F2F2F2",
		"terminal.ansiBrightYellow": "#F1F139",
		"terminal.selectionBackground": "#FFFFFF",
		"terminalCursor.foreground": "#F2F2F2"
	}
}
IntelliJ Integration

Got to Settings > Editor > Color Scheme > Console Font to tweak the Console Font. My settings look like this:

Now go to Settings > Editor > Color Scheme > Console Colors and change the colors, so that they match with your color scheme.
Ready

That's it. You should now have a decent looking Windows Terminal that matches with the integrated VSCode and IntelliJ terminal 😃