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.
Let's begin by setting up powershell and the Windows Terminal.
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 via PowerShellGet to get some nice looking icons for the ls
output:
> Install-Module -Name Terminal-Icons
Install posh-git via PowerShellGet for git command autocompletion:
> Install-Module -Name posh-git
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, 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.
Now that we have installed all required packages we can start with the setup.
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:
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'
}
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 does not 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"
}
]
}
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.
> sudo apt install zsh
> git clone https://github.com/zsh-users/zsh-syntax-highlighting.git ~/.zsh/zsh-syntax-highlighting
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
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
Use the following command to set Zsh as the default shell:
sudo chsh -s $(which zsh)
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"
}
}
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.
That's it. You should now have a decent looking Windows Terminal that matches with the integrated VSCode and IntelliJ terminal 😃