Nice Front-End / Node Development Environment on Windows 10 Setup with VS Code, Cmder, PowerShell, Posh-Git, Oh-My-Posh, and Powerline Fonts
I work as a full stack developer using Windows environment. For my console need, I am using Cmder which is based on ConEmu with PowerShell as my shell of choice, being on Windows and all (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 the 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 front-end development in. I've also done some .NET Core development 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.
For now, we'll focus on customizing Cmder / ConEmu Powershell with git, posh-git, oh-my-posh and the Powerline fonts. Specifically on how I setup mine.
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.
Installation instruction here...
Set-Theme agnosterClone the powerline repository from GitHub.
git clone https://github.com/powerline/fonts.gitafterward, do the following:
cd fonts
.\install.ps1Wait for all the fonts to be installed.
From inside Cmder / ConEmu settings dialog, ensure you choose the powerline font you wish to used. i.e. Menslo ... for Powerline, etc. Also make sure you set the same font for the Alternative font to use, otherwise some characters will not show.
- Add the following function to your powerline $PROFILE. To edit your $PROFILE, just run
ise $PROFILEfrom 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"
}stole from here.
- Run the following script inside PowerShell:
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:
