Kalau di artikel lain saya sudah membahas cara menginstall Sass di windows pada artikel : Menginstall SASS di Windows kali ini saya akan share cara menginstall Sass pada Sublime. Bagi kalian yang memakai editor yang sama dan sedang memulai belajar Sass/Scss, silahkan di simak ya caranya :

Installing Sass

1. Setelah Sublime terbuka, tekan ctrl+shift+p lalu akan terbuka Sublime Command Palette.
2. Lalu ketik dan pilih Package Control: Install Package.
3. Setelah list package terbuka, lalu ketik SASS, dan pilih SASS – SASS Support for TextMate & Sublime Text (2 & 3).
4. Tunggu install package selesai.

Sass Build

Setelah installing Sass selesai, anda dapat menginstall package SASS Build dengan mengikuti langkah-langkah diatas. SASS Build agar ketika anda menyimpan file SCSS langsung di generate menjadi file CSS.

Defaultnya file css akan tersimpan di level folder yang sama seperti illustrasi dibawah ini :

-- scss
----- style.scss
----- style.css

Tapi kita bisa custom agar setelah kita menyimpan file SCSS lalu file CSS digenerate di folder yang berbeda, cara seperti dibawah ini :

Buka sublime, pilih menu tools > build system > new build system, lalu isikan code berikut:

{
"cmd": ["sass", "--update", "$file:${file_path}/../css/${file_base_name}.css", "--style", "compressed", "--sourcemap=none", "--no-cache"],
    "windows":
    {
        "shell": "true"
    }
}

setelah itu simpan di dalam folder AppData\Roaming\Sublime Text 3\Packages\User . Code ini akan melakukan perintah untuk menyimpan file css di dalam folder css tersendiri seperti illustrasi dibawah :

-- scss
----- style.scss

-- css
----- style.css

Package tambahan yang bisa anda install :

1. Alignment
2. All AutoComplete
3. DocBlockr
4. SideBarEnhancements
5. Terminal
6. Emmet
7. SublimeOnSaveBuild

Referensi tentang plugin ini bisa kalian cek disini : 9 Plugin Sublime Text yang Wajib Diinstal Programmer