Ruby Studio Blog

Agile web development and IT solutions

SASS and CoffeeScript Support for Sublime Editor

My current programming editor of choice is Sublime Editor 2. Its code highlighting and snippets component supports a host of languages by default, however SASS and CoffeeScript are still not in the defaults, even after the recent update.

Luckily Sublime supports TextMate bundles, so there’s an easy way to add the missing bits and pieces. Here’s how to do it step by step:

Get the SASS and CoffeeScript bundles (both available on github):

1
2
git clone git://github.com/n00ge/sublime-text-haml-sass.git
git clone git://github.com/jashkenas/coffee-script-tmbundle.git

Open the Sublime Editor Packages folder

This is the folder containing all the syntax highlighting bundles. Its location differs, depending on the OS you’re using, so best way to open it is via the editor’s Preferences > Browse Packages… menu entry:

Copy the new bundles into the Packages folder

For SASS you only need the SASS directory from the cloned repository. Disregard the Sass and Ruby Haml folders. By the time of this writing Subilme already ships with built-in support for Ruby Haml.

For CS you need the entire cloned coffee-script-tmbundle repo as a folder, so copy it directly into Packages, optionally renaming it into something shorter and cleaner, like “CoffeeScript”.

Now restart Sublime Editor to activate your new bundles

That’s it. Enjoy working with SASS and CoffeeScript!

Comments