I work as a full-stack developer at work. We are a Windows & Azure shop, so we are using Windows as our development platform, hence this customization.
For my console needs, I am using Cmder which is based on ConEmu with PowerShell as my shell of choice.
Yes, yes, I know nowadays you can use the Linux subsystem on Windows 10 which allow you to run Ubuntu on Windows. If you are looking for customization of the Ubuntu bash shell, check out this article by Scott Hanselman.
For source control, I use git for my spikes since our main source control at work is still using hosted TFS on Visual Studio Team Services.
My editor of choice nowadays is VS Code which is lightweight, customizable and all around a good environment to do development for AngularJS, Angular, NodeJS and other spikings in general. I've also done some .NET Core developments on the editor which is supported quite well including debugging if you follow that style of development. VS Code customization is a large topic by itself, so I won't be writing about it here... Perhaps some other time...
If you want to be on the cutting edge, you can try Visual Studio Code Insider. From my experience so far, it is pretty stable and is my VS Code environment of late.
For now, we'll focus on customizing Cmder, Powershell with git, posh-git, oh-my-posh and the Powerline fonts, specifically on how I setup mine which will net you something like the figure below.
A lot of people has written up about customizing PowerShell but I can only find bits and pieces. This article hopefully will combine those bits and pieces into a more coherent end-to-end story.
If you are already on Windows 10, you can skip this section.
If not, you will need to make sure you have PowerShellGet installed. We will use it to pull PS Modules from PS Gallery. Instruction on how to get PowerShellGet can be found here.
Upgrading to PowerShell v5 is preferable since it comes with PowerShellGet. The Get WMF 5 route from the link above will do this for you. Just make sure to download the right version for you OS. I.e. if you are on Win2K8R2, choose Win8.1AndW2K12R2-KB3134758-x64.msu from the Download list, etc.
You can check your PowerShell version by typing the following from within PowerShell.
$host.Version
Start PowerShell using Run As Administrator option. We might need it until we get everything installed.
I use Chocolatey as my install manager. To install Chocolatey, do the following from within PowerShell:
Set-ExecutionPolicy -ExecutionPolicy RemoteSigned -Force
PowerShell might complain. If so, you probably need to change RemoteSigned
to ByPass
or Unrestricted
. Running Get-ExecutionPolicy
from inside PowerShell will tell you what to change it to.
Afterward, run the following and wait for it to finish:
iwr https://chocolatey.org/install.ps1 -UseBasicParsing | iex
If you already have git installed, you can skip this part.
If you do not know if git has been installed or not, you can check by typing the following into PowerShell:
git --version
If you have it installed, you should see the version of git that has been installed on your system.
If it is not installed, run the following to install Git from PowerShell via Chocolatey:
cinst git.install -y
If you already have Cmder installed, you can skip this part.
Otherwise, run the following to install Cmder from PowerShell:
cinst cmder -y
Clone the powerline repository from GitHub.
git clone https://github.com/powerline/fonts.git
afterward, do the following:
cd fonts
.\install.ps1
Wait for all the fonts to be installed.
From this point onward, you can switch to Cmder and do the rest from there.
Open up Cmder Settings dialog (Win+Alt+P when Cmder window is active) and ensure that one of the Powerline fonts is used for both Main console font and Alternative font as shown below. The Alternative font is needed for showing the correct icons for git on the PowerShell prompt.
Here I am using the Meslo LG M for Powerline font which I think looks quite nice. I tried using Ubuntu Mono for Powerline, but for some reason, it messed up my icons.
Try different fonts yourself and see which one you like. Just remember that you will need to choose the font that has been patched for Powerline, otherwise you Git icons might not show correctly.
Pay attention that I also highlighted the ConEmu.xml location in the Storage field. You will need this location later when we customize the ConEmu Theme. It's not necessary but it's a nice to have. Also, yours might be located in a different directory than mine since I installed Cmder manually previously.
Another thing that you might want to customize is to put Cmder into Quake style where you can show and hide it using Ctrl+~ key. To do that set the Quake mode setting to something like this:
I like the animation speed set to 150 milliseconds since it is a bit snappier than the default 300 milliseconds.
To set PowerShell as your default task when you open Cmder, ensure that it is set as Specified named task as per figure below.
Take note of the profile.ps1 location above inside the Selected contents section. I already changed this to the $PROFILE variable from inside PowerShell. By default, Cmder is pointing to its own profile.ps1 location. If you don't change this, your PowerShell profile customization that we will do later will not be loaded automatically upon launching Cmder or any new PowerShell task tab inside Cmder.
To check where your own PowerShell profile location, you can type $PROFILE inside PowerShell.
If you are not familiar with Windows, %USERPROFILE% is equivalent to C:\Users\username (which is the default user profile location in Windows, unless you have moved it somewhere else).
Also, you might have this file already or not. It does not matter. We'll create one or edit existing one later. The important thing here is that you need to point the PowerShell task to the right location or your profile customization will not load automatically and you will have to load it manually by typing the following into PowerShell:
. $PROFILE
_It's the equivalent of source .bashrc
or source .zshrc
, etc. if you are familiar with Linux.
In any case, it is a nice thing to remember when you further customize your $PROFILE.
To customize your profile you can run ise $PROFILE
from PowerShell. Again, we will do this later, don't bother with it now.
To change that selected task contents, you can do it from the Tasks tab like the figure below. Ensure that you change both PowerShell and PowerShell as Admin.
I am using one of the default themes that comes with ConEmu / Cmder which is Twilight.
If you want to add other themes, you can clone the following git repository: https://github.com/joonro/ConEmu-Color-Themes and follow his instruction on How To Install it.
As I mentioned previously, pay attention to the Storage field setting in the figure above. You need to replace the -ConfigPath
value to that particular ConEmu.xml location.
To clone the repository do:
git clone https://github.com/joonro/ConEmu-Color-Themes.git
Afterward, go to the tools directory like shown below:
cd .\ConEmu-Color-Themes\tool
And run the script to install a particular theme. The theme is located outside the tool directory.
.\Install-ConEmuTheme.ps1 -ConfigPath C:\Users\jimmy\Downloads\cmder\vendor\conemu-maximus5\ConEmu.xml -Operation Add -ThemePathOrName ..\oceans16-dark.xml
In the figure about I am using an alias l which I bind to Get-ChildItemColorFormatWide
from this git repository. Don't worry if you don't have it. Just do ls
for now. I'll show you how to install that cmdlet a bit later.
Posh-Git (PowerShell Git) will provide you with additional information on your PowerShell prompt when you are in a directory that has been designated as a local git repository.
Prior to installing these module, run the followings:
Install-PackageProvider NuGet -MinimumVersion '2.8.5.201' -Force
Set-PSRepository -Name PSGallery -InstallationPolicy Trusted
Install-Module -Name 'posh-git'
To install it, run the following from PowerShell:
Install-Module -Name 'posh-git'
Oh-My-Posh will let you theme your PowerShell prompt.
To install it, run the following from PowerShell:
Install-Module -Name 'oh-my-posh'
If PowerShell complains that you cannot do this, the most likely problem is that you do not have PowerShell v5 and PowerShellGet is not installed correctly. Revisit the step to do this above if that is the case.
To test the new Oh-My-Posh, do the followings from inside PowerShell:
Import-Module 'posh-git'
Import-Module 'oh-my-posh'
Set-Theme agnoster
If you've done everything correctly, your PowerShell prompt should like something like the figure below.
If something is off, like you are seeing weird characters, etc. It is probably due to you misconfiguring the Powerline font inside Cmder setting. If so, revisit the section above to configure it.
If you don't like the agnoster theme, you can set it to something else. Visit the Oh-My-Posh GitHub repository to see what other themes are available and additional instructions.
The following customization will colorize the directory listing. To install Get-ChildItemColor, simply run the following in PowerShell.
Install-Module -Name 'Get-ChildItemColor'
Once installed, you can use these cmdlet Get-ChildItemColor
and Get-ChildItemColorFormatWide
to list your directory content and it will colorize files, directory, etc. appropriately.
In the next section we will add alias so we can use l
and ls
as shortcuts to the cmdlet above.
Run ise $PROFILE
from within PowerShell. This will launch the Integrated Scripting Environment for PowerShell and let you edit your $PROFILE file.
Add the following things to that content of the $PROFILE file.
# Ensure that Get-ChildItemColor is loaded
Import-Module Get-ChildItemColor
# Set l and ls alias to use the new Get-ChildItemColor cmdlets
Set-Alias l Get-ChildItemColor -Option AllScope
Set-Alias ls Get-ChildItemColorFormatWide -Option AllScope
# Helper function to change directory to my development workspace
# Change c:\ws to your usual workspace and everytime you type
# in cws from PowerShell it will take you directly there.
function cws { Set-Location c:\ws }
# Helper function to set location to the User Profile directory
function cuserprofile { Set-Location ~ }
Set-Alias ~ cuserprofile -Option AllScope
# Helper function to show Unicode character
function U
{
param
(
[int] $Code
)
if ((0 -le $Code) -and ($Code -le 0xFFFF))
{
return [char] $Code
}
if ((0x10000 -le $Code) -and ($Code -le 0x10FFFF))
{
return [char]::ConvertFromUtf32($Code)
}
throw "Invalid character code $Code"
}
# Ensure posh-git is loaded
Import-Module -Name posh-git
# Start SshAgent if not already
# Need this if you are using github as your remote git repository
if (! (ps | ? { $_.Name -eq 'ssh-agent'})) {
Start-SshAgent
}
# Ensure oh-my-posh is loaded
Import-Module -Name oh-my-posh
# Default the prompt to agnoster oh-my-posh theme
Set-Theme agnoster
The comments above should be self-explanatory.
That's it. You should now have a pimped up PowerShell in Cmder that will let you know what's going on with the current git repository, a nicer prompt and fully colorized. Enjoy!
- Add the following function (stole from Michael Naumov) to your powerline $PROFILE. To edit your $PROFILE, just run
ise $PROFILE
from within PowerShell:
function U
{
param
(
[int] $Code
)
if ((0 -le $Code) -and ($Code -le 0xFFFF))
{
return [char] $Code
}
if ((0x10000 -le $Code) -and ($Code -le 0x10FFFF))
{
return [char]::ConvertFromUtf32($Code)
}
throw "Invalid character code $Code"
}
- Run the following script inside PowerShell:
. $PROFILE
Write-Host "$(U 0xE0B0) $(U 0x00B1) $(U 0xE0A0) $(U 0x27A6) $(U 0x2718) $(U 0x26A1) $(U 0x2699)"
You should see something like the second line in the figure below:
If you don't see the symbols, please make sure you did the Powerline font installation and Cmder customization as described in the related section above.
I installed the powerline font in the Windows Font folder and specified "Anonymous Pro for powerline" in the WSL2 Terminal settings and it worked. Thank you!