About a year ago a friend of mine introduced me to VS Code, and once I learned it supported Unity I never looked back. Now, I use it for more than just coding, it’s also a notebook with a series of markdown files organized into various categories. Now no development environment (devenv) is perfect and that’s why extensions were created.

In this article, I describe my favorite 15 extensions for working with Unity, C#, git, and markdown files. Leave a comment to share the devenv and extensions you use.

Code – Navigating and Showcasing

I use the following extensions to help track or showcase my code.

Bracket Pair Colorizer 2

Get it on the Marketplace.

This adds a visual element to identifying matching brackets, and you can define which tokens to match and what colors to use.

Bracket Pair Colorizer 2

The only thing to watch out for is if you turn on Show Brackets In Gutter then the gutter icon can prevent you from setting a breakpoint until you move your cursor. It’s a minor thing once I figured out what was happening.

Make sure you get version 2, it has speed improvements and some settings were cleaned up which broke backwards compatibility.

Colonize

Get it on the Marketplace.

One of the great things about modern devenvs is that they automatically create matched pairs of tokens. You type a double quote and you get two of them, the starting and closing one. One of the bad things is, you guessed it, automatically creating matched pairs of tokens. On my keyboard the END key is not easily reachable and it interrupts my coding flow. This extension solves this issue for me.

This adds a semicolon to the end of the line via one of three shortcuts. You can a) insert a semicolon at the end of the line and have the cursor jump to the end of the line, or b) have cursor stay where you’re typing, or c) continue on a new line. This saves a lot of time when I type out print($"Add debugging info...");.

C#

Get it on the Marketplace.

Uh, yeah, kinda important. πŸ˜€

JSONPath Extraction

Get it on the Marketplace.

I just found this one about a week ago, and I use it often. It allows you to extract parts of a JSON document using a JSONPath query.

I use Trello for, well, everything. All my TODOs end up on a checklist, and every week I copy checklist items to create work lists for the week. Unfortunately, Trello doesn’t make it easy to copy checklist items short of the old copy/paste routine, and that only happens one at a time. Sometimes, I need to move a dozen or more checklist items around, it’s tedious. However, Trello supports exporting an entire card as a JSON file. And bam, that’s where this extension comes in, it allows you to create and save JSONPath queries. In this case, I have two saved queries to get all the checklist items from either the first checklist or all the checklists on a card.

  • $.checklists[:1].checkItems[*].name – items from first checklist
  • $.checklist[*].checkItems[*].name – all items from all checklists

I imagine I’ll find more uses for it in the future.

Polacode

Get it on the Marketplace.

NOTE: As of 15 July 2020, Polacode v0.3.4 and VS Code v1.47 and later don’t play well together. An issue was submitted on GitHub by MrRefactoring.

Sometimes you need a screenshot of your code, and sometimes all the code you need is not on the screen. Sure you could take multiple screenshots and then stitch them together, but who has the time for that? That’s where Polacode comes in, start the extension and highlight the code you want and presto you got a picture. It doesn’t matter if it’s 4 lines or 400 lines.

Comment Highlighting

Comments are an integral part of my code, how else would I remember to fix a bug I just found but since I’m tracking down 5 other bugs I don’t want to deal with it right now. 🀣

Better Comments

Get it on the Marketplace.

Sometimes I need my comments to grab my attention, and this extensions helps them do just that.

Better Comments

Add a little color to your comments by prefixing specific symbols. For something important just add a bang after the start of the comment – // ! this is urgent and it displays red. You can add more tokens than the default 5 and you can adjust the colors both foreground and background.

Todo Tree 🌟

Get it on the Marketplace.

This is one of my most used and favoritest (it sounds like a real word) extension.

This extension quickly searches your workspace for comment tags like TODO, FIXME, and others to create a list. It supports adds gutter icons and customizable colors, as well.

ToDo Tree

This is great for not only creating a single list of all your scattered TODOs, FIXMEs, and HACKs, you can also extend it to support other types of quickly referenced code. For example, I created one called FORMULA which allows me to easily track all my formulas and since I’m creating a math heavy game, I have quite a few. On the side bar you can display all the important comments in many different ways and you can even export them so you can import them into a Trello checklist. πŸ˜€

TODO Tree List on Side Bar

The octicons support colors, while the codicons do not. That sounds like it should be part of the Transformers, doesn’t it. πŸ˜‰

I listed the settings I currently use for this extension.

    "todo-tree.general.tags": [
        "BUG",
        "HACK",
        "FIXME",
        "TODO",
        "FORMULA"
    ],
    "todo-tree.highlights.customHighlight": {
        "BUG": {
            "foreground": "#00FF00",
            "gutterIcon": true
        },
        "HACK": {
            "icon": "zap",
            "foreground": "yellow",
            "gutterIcon": true
        },
        "FIXME": {
            "foreground": "red",
            "gutterIcon": true
        },
        "TODO": {
            "foreground": "#FF8C00"
        },
        "FORMULA": {
            "icon": "graph",
            "foreground": "#ff00ff",
            "gutterIcon": true
        }
    },

Unity

See Unity Development with VS Code for instructions on setting up VS Code for Unity.

Debugger for Unity

Get it on the Marketplace.

Sure Debug.Log("made it here"); can work in many situations, but sometimes you need to crank it to full debugger power. And that’s what this does. You start the debugger in VS Code then hit Play in the Editor, and wait for your code to break. This is a must-have for tracking down all those tricky and well-hidden bugs.

As a side note, VS Code has a really kewl feature of conditional breakpoints. You can make a breakpoint activate only when an expression evaluates to true, or after the breakpoint has been hit a specific number of times. There are other types of advanced breakpoints, but that’s beyond the scope of this article.

MonoBehaviour Snippets

Get it on the Marketplace.

Can’t remember all the different OnCollision methods MonoBehaviours has? No worries. This has them all (I should verify this someday), OnCollisionEnter, OnCollisionExit, OnCollisionStay, OnCollisionEnter2D, OnCollisionExit2D, OnCollisionStay2D. And because snippets are powerful and great it includes all the parameters you need.

If you want to build your own snippets, check out Snippets in VS Code.

ShaderlabVSCode(Free)

Get it on the Marketplace.

I just added this to my extensions in the last few weeks, and I have only played with a few shader tutorials so far so not much chance to use this one yet. I imagine once I get into shaders I will have more to say about this one.

Unity Tools

Get it on the Marketplace.

This adds a bunch of just nice-to-have features, like opening Unity documentation via Ctrl + ‘. It also has a shortcut to create a standard set of folders when you start a new project. You can even customize the folders to your liking.

Version Control

No list is complete without git.

GitLens

Get it on the Marketplace.

This supercharges the git capabilities built into VS Code. Honestly, as a solo game dev I don’t get as much use out of this. I mean I could check the file or even the line history to see who to blame but it’s always the same person. I need to get more dev friends and take my git to the next level. πŸ€”

Markdown

I take a lot of notes and over the years I’ve added more and more formatting to make them easier to read. If I’m going to format my notes I might as well use Markdown so I can easily convert them to HTML or PDF. These extensions help me get my ideas down on “paper” in a semi-organized fashion.

Markdown All In One

Get it on the Marketplace.

This has a lot of markdown features, not really “all” but a fair amount.

All you need for Markdown support, keyboard shortcuts, table of contents, auto preview, and more. I like to see the table of contents rather than a shortcode (aka [[TOC]]) and this extension does that, including anchor links.

Markdown All In One Table of Contents

It also supports some standard keyboard shortcuts like Ctrl+B for bold, Ctrl+I for italic. It also supports some math markdown (although for serious math it recommends Markdown+Math). And finally, it has good list editing support by continuing a list when you hit Enter, indenting a list with Tab, and auto-numbering a list when you hit Enter then Tab. All-in-all it’s a great starter set for Markdown support.

Markdown Extended

Get it on the Marketplace.

For all the things not covered by Markdown All In One there is Markdown Extended. Some of the features overlap but I haven’t noticed any conflicts. The big deal for me is this one includes table support with auto-resizing on save. Other really nice features include export to HTML, PDF, PNG, or JPEG formats. This one also includes a lot of lesser used (at least by me) features like footnotes, abbreviations, deflists, and etc. However, I know that I can eventually use all the kewl things someday so nice.

Markdown Imsize Support

Get it on the Marketplace.

Surprisingly, this feature is not covered by either of the other two markdown extensions I use. I sometimes add images to my markdown, especially if I’m writing a draft blog post. Rather than always seeing the images at full size this allows me to resize how they appear in preview mode and exported. It’s the same as adding a width or height attribute to an HTML img tag.

Wrapping Up

So that’s my list of 15 very useful extensions for developing Unity games with VS Code. What deven and extensions do you use?

Life’s an adventure, enjoy your quest!

Send a Missive

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 )

Google photo

You are commenting using your Google 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 )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.