Configuring Sublime Text to be awesome

Your text editor could look like this.

Sublime Text 3 is without a doubt my favorite text editor. It has a super flexible plugin API, and people have done some pretty amazing things with it. It has a much smaller footprint than an IDE like NetBeans/Eclipse/IntelliJ. It offers a lot of power with multi-cursor operations and bulk text editing. This post details some of my favorite plugins and the settings I prefer to use with Sublime.

Step 1: Install Package Control

First off, you’ll need to install Package Control. Package Control is basically the app store for Sublime. It makes installing plugins a breeze. To install it, follow the instructions on the Package Control website.

Now that you have Package Control installed, you can easily install plugins by hitting Ctrl+Shift+P (Cmd+Shift+P on Mac) and typing install package and hitting enter.

You’ll be presented with a list of available plugins, which you can filter by typing in the name of the plugin you want.

Step 2: Install these awesome plugins

• SyncedSideBar — This is possibly my favorite despite its simplicity. When you open a file (such as through the Goto Anything search), it jumps to that file in the left hand file system pane.
• DocBlockr — helps format your code documentation (especially functions)
• Theme — Afterglow — This is just my favorite theme. I love the customized file icons and the new tab layout.
• Git — Provides some nice git functionality in Sublime, including seeing line by line blames and annotations.
• VCS Gutter — This shows your version control diffs in the side bar. New lines have a green plus, changed lines have a yellow square, and deleted lines have red tags. You can see an example of each in the screenshot at the top of this post.
• JSCS-Formatter — Automatically formats your code according to your JSCS settings.
• SublimeLinter — A framework for linting in Sublime.
• SublimeLinter-jscs — Lets you set up automatic JSCS linting.
• SublimeCodeIntel — This one is a bit more resource heavy, so I don’t always install it. It adds some IDE-like functionality such cmd+click to get to function definitions and better code completion.
• MarkdownEditing — This has nice formatting for editing markdown files. It’s a must-have for editing markdown in Sublime. It has a light theme by default, but you can change that in the preferences.
• Dockerfile Syntax Highlighting — Just adds syntax highlighting for docker files. Sublime doesn’t do that by default.

Step 3: Set up your user preferences

One of the nice things about Sublime is that it has highly customizable settings that let you change behavior, appearance, and more. You can read about them and all available preferences in the Sublime default preferences file. Here are Sublime’s instructions for modifying settings: https://www.sublimetext.com/docs/3/settings.html.

These are my preferred settings:

{
    "color_scheme": "Packages/User/SublimeLinter/Monokai (SL).tmTheme",
    "find_selected_text": true,
    "folder_exclude_patterns":
    [
        "node_modules",
        ".git"
    ],
    "font-size": 14,
    "font_size": 10,
    "ignored_packages":
    [
        "Vintage"
    ],
    "sidebar_size_12": true,
    "status_bar_brighter": true,
    "tabs_small": true,
    "theme": "Afterglow-green.sublime-theme",
    "trim_trailing_white_space_on_save": true,
    "word_wrap": false
}

On some operating systems Sublime no longer has hot keys set for opening the project switcher. If that’s the case for you, you can add this to your User key bindings file to get your project switcher back.

[
    { "keys": ["ctrl+alt+p"], "command": "prompt_select_workspace" }
]

I also like to add this to Packages/User/Markdown.sublime-settings so my markdown files have a dark theme:

{
    "color_scheme": "Packages/MarkdownEditing/MarkdownEditor-Dark.tmTheme",
}

Step 4: Build awesome stuff

Your text editor is now ready to help you build awesome stuff. Enjoy!