Bradley Braithwaite
1 import {
2 Learning,
3 JavaScript,
4 AngularJS
5 } from 'Brad on Code.com'
6 |
Check out my online course: AngularJS Unit Testing in-depth with ngMock.

Sublime Text 2 Developer Setup

My Sublime Text 2 Developer Setup.

on
on tools

This is a working document that details my Sublime Text 2 setup including OS configuration, key mappings, packages etc. This is Mac OSX specific.

Open from the Terminal

I always launch ST from the terminal using:

subl .
subl file.js
subl my_folder

To set this up, create the following symlink (enter in terminal):

ln -s "/Applications/Sublime Text 2.app/Contents/SharedSupport/bin/subl" ~/bin/subl

See the full documentation for more information.

Right-click option in Finder

See the following tutorial to Right click, open with Sublime Text 2.

Packages

First step is to install package manager:

General

  • AdvancedNewFile - handy for creating new files via the console.
  • Google Spell Check - the default spell checker isn’t the best. This package uses the Google API.
  • PlainTasks - integrated TODO list.

Markdown

  • Markdown Extended - markdown syntax highlighter.
  • Monokai Extended - additional markdown syntax highlighting for title tags, bold etc.
  • Smart Markdown - useful short-cuts for collapsing sections by title, switching between titles etc.

Currently Trialling:

  • SublimeLinter - can be used in conjunction with jshint etc.
  • SublimeCodeIntel - full-featured code intelligence and smart autocomplete engine for Sublime Text.
  • sublime-mocha-snippets - snippets for writing tests using Mocha in NodeJS/JavaScript.

Custom Shortcut Mappings

Add the following to Preferences > Key Bindings - User:

[
   // reindent the document
   { "keys": ["alt+r"], "command": "reindent", "args": {"single_line": false}} 

   // replaces the 'create new file' function for the adv new file package
   { "keys": ["ctrl+n"], "command": "advanced_new_file" },
   
   //  replaces the show/hide sidebar keymap (Cmd + k, Cmd B)
   { "keys": ["ctrl+s"], "command": "toggle_side_bar" }
]

User Preferences

This is what my user preferences configuration looks like:

{
   "auto_complete_commit_on_tab": true,
   "auto_complete_delay": 1,
   "bold_folder_labels": true,
   "caret_style": "phase",
   "color_scheme": "Packages/Monokai Extended/Monokai Extended.tmTheme",
   "dictionary": "Packages/Language - English/en_GB.dic",
   "font_size": 17.0,
   "highlight_line": true,
   "ignored_packages":
   [
      "Vintage"
   ],
   "tab_size": 3
}

Preview Markdown Files

When I’m editing a markdown file I sometimes want to be able to preview the output with the ⌘ + B short-cut.

I use Marked as the preview app and create a build system in ST.

To create the new build system in ST:

  • Select Tools > Build System > New Build System
  • Paste in the below JSON
  • Save the file (I named it Marked.sublime-build)
{  
   "shell": "true",  
   "cmd": ["open -a marked \"$file\""],
   "file_regex": "^(...*?):([0-9]*):?([0-9]*)",
   "selector": "text.html.markdown"
}

Revert ALL settings to default

To restore to “factory” settings, delete the following folder (that contains user settings, packages etc.).

~/Library/Application Support/Sublime Text 2

NB this will also remove your license key. You can get this before deletion from the Settings > License.sublime_license file in the aforementioned folder.

Useful Shortcuts

Sometimes I rely on ⌘ + P too much!

  • Toggle Comment: ⌘ + /
  • Toggle Block Comment: ⌘ + Shift + /
  • Move to Group: Ctrl + Shift + 1 (or group number)
  • Toggle Spell Check: F6
  • Go to method: ⌘ + R (quicker than ⌘ + P and then @)
  • Find Shortcut keys - ⌘ + G (find next in particular)
  • ⌘ + I - incremental search

Finding Snippets, Package Sources etc

Sublime Text 2 -> Preferences -> Browse Packages...

Custom Snippets will usually be location in the User folder.

Features I should use more

  • Projects - can exclude files etc.
  • Workspaces - can save layout properties.
  • Snippets - save typing!
  • Regex Search
  • Everything under Edit > Text (insert line above etc).
  • Join line (Edit > Line)
  • Mutliple Cursors (Ctrl+Shift+ Arrow Up/Down)
  • Bookmark shortcut keys
  • That you can combine file search and method search e.g. ⌘ + P > foo@bar (foo is file, bar is method)
SHARE
Don't miss out on the free technical content:

Subscribe to Updates

CONNECT WITH BRADLEY

Bradley Braithwaite Software Blog Bradley Braithwaite is a software engineer who works for search engine start-ups. He is a published author at pluralsight.com. He writes about software development practices, JavaScript, AngularJS and Node.js via his website . Find out more about Brad. Find him via:
You might also like:
mean stack tutorial AngularJS Testing - Unit Testing Tutorials