Markdown Preview in Visual Studio Code

I used to keep around a copy of Markdown Pad to enable me to preview any markdown files I created. However, after an update to a Awesomium SDK Markdown Pad stopped working. I reported the issue but it hasn’t been resolved yet.

But after Irwin Strachan mentioned using Visual Studio Code as a Markdown editor, I wondered if there was an extension that allowed it to Preview the Markdown as well – because that was really all that was missing for me to do away with Markdown Pad. So I went and did a search for Markdown extensions in VS Code:

ss_vscode_markdownextensions

Want to install extensions in VS Code? Press F1 and type ‘ext install’.

I found a few, but after playing around with them a bit I noticed a small button in the latest version of Visual Studio Code at the top right corner when a markdown file is open:

ss_vscode_previewbutton

The Preview button!

I wonder what that might do?

ss_vscode_preview

That is a great looking markdown preview.

Oh, now look at that! Just what I needed. I don’t know which version of Visual Studio Code this was added in, but it is fantastic!

You can also use the Visual Studio Code split window function to edit and Preview at the same time:

ss_vscode_splitpreview

Changing the markdown automatically updates the preview – nice!

While we’re on the topic of markdown, Irwin also pointed me at this awesome markdown tutorial – it makes learning markdown fun!

Now, Visual Studio Code is not on par with ISE Steroids when it comes to editing PowerShell files, but when you’re dealing with lots of different types of files (including PS files) it can be a real time saver. I highly recommend downloading a copy of Visual Studio Code, installing the PowerShell Extension and giving it a try.

 

One thought on “Markdown Preview in Visual Studio Code

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s