Auto compile SCSS files in Sublime Text 2

Question

Ok, here is what I want:

1. I write .scss files, not .sass files
2. On saving the file, I get the corresponding .css file in the same folder

Now there are plenty of SASS plugins on Sublime Text2 but none seems to provide anything beyond syntax highlighting for me.

Any suggestions on how to get auto-compiling working on Sublime Text2.

Answer 1

I didn't find any existing plugins that did this, so here it is:

Assuming you've installed the SCSS plugin from Package Control, you can save this as Packages/User/SCSS.py.

import sublime_plugin
import subprocess
import os
from threading import Thread

def compile(input_file):
    output_file = os.path.splitext(input_file)[0] + ".css"
    cmd = "sass '{0}':'{1}'".format(input_file, output_file)
    subprocess.call(cmd, shell=True)

class SCSS(sublime_plugin.EventListener):

    def on_post_save(self, view):
        scope = (view.syntax_name(view.sel()[0].b)).split().pop()
        if scope == "source.scss":
            input_file = view.file_name()
            t = Thread(target=compile, args=(input_file,))
            t.start()

Of course, this would be better as an official Package Control plugin with user configurable settings (where to save files, on/off, etc), but this meets your requirements and doesn't block the editor.