ctrl+shift+p filters: :st2 :st3 :win :osx :linux
Browse

SASS Build

by jaumefontal ST2/ST3 Trending Top 100

SASS build sytem for Sublime Text 2

Details

  • 2015.03.10.11.27.26
  • github.​com
  • github.​com
  • 3 years ago
  • 1 hour ago
  • 5 years ago

Installs

  • Total 147K
  • Win 88K
  • OS X 45K
  • Linux 14K
Jan 18 Jan 17 Jan 16 Jan 15 Jan 14 Jan 13 Jan 12 Jan 11 Jan 10 Jan 9 Jan 8 Jan 7 Jan 6 Jan 5 Jan 4 Jan 3 Jan 2 Jan 1 Dec 31 Dec 30 Dec 29 Dec 28 Dec 27 Dec 26 Dec 25 Dec 24 Dec 23 Dec 22 Dec 21 Dec 20 Dec 19 Dec 18 Dec 17 Dec 16 Dec 15 Dec 14 Dec 13 Dec 12 Dec 11 Dec 10 Dec 9 Dec 8 Dec 7 Dec 6 Dec 5 Dec 4
Windows 61 122 103 68 46 39 72 74 94 81 66 44 43 63 87 76 73 21 33 28 65 59 81 85 50 28 49 65 65 80 83 78 32 40 68 71 104 88 71 52 66 80 104 97 184 126
OS X 25 20 35 21 15 10 21 16 23 22 35 11 12 32 23 17 24 6 7 13 18 14 16 14 14 12 7 18 20 23 16 21 11 3 18 26 25 23 29 19 11 22 26 25 32 29
Linux 5 10 10 3 4 4 5 10 9 9 6 3 2 5 7 5 8 7 3 2 3 5 5 7 3 2 4 5 6 5 8 4 4 4 4 10 9 8 9 9 3 9 10 7 7 7

Readme

Source
raw.​githubusercontent.​com

SASS build system for Sublime Text 2

Note: I'm working in a portable version of the SASS build with all the libraries included & ready to use. It will be available (I hope!) the next week.

Description

Provides two Build system for SASS files (with and without compression)

Prerequisites

Requires Ruby & SASS libraries.

Step by step:

  1. Install Ruby library

    Windows: Download and install Ruby. You can find it here: http://rubyinstaller.org/downloads/

    Reboot after install it.

    IMPORTANT: Don't forget to mark the option 'Add Ruby executables to your PATH'. If you don't check the option, you will have to modify the path in the Build file afterwards.

    OS X & Linux: It's already installed. Easy! :)

  2. Installing SASS

    Open your console ('Command prompt with Ruby' on Windows) and execute the following command:

    gem install sass

Installing

OPTION 1 - With the Package Control plugin (recommended)

The easiest way to install this package is through Package Control.

  1. Download and install the Package Control Plugin. Follow the instructions on the website.

  2. Open the command panel: Control+Shift+P (Linux/Windows) or Command+Shift+P (OS X) and select 'Package Control: Install Package'.

  3. When the packages list appears type 'SASS' and you'll find the SASS Build System. Select to install it.

  4. Now you can compile your SASS files! Launch your build with Control+B (Linux/Windows) or Command+B (OS X).

  5. Enjoy your coding =)

OPTION 2 - With Git

Clone the repository in your Sublime Text “Packages” directory:

git clone git://https://github.com/jaumefontal/SASS-Build-SublimeText2.git SASS-build

You can find your 'Packages' inside the following directories:

  • OS X: ~/Library/Application Support/Sublime Text 2/Packages/
  • Windows: %APPDATA%/Sublime Text 2/Packages/
  • Linux: ~/.Sublime Text 2/Packages/

OPTION 3 - Without Git

Download the latest source zip from Github and extract it into a new folder named SASS-Build in your Sublime Text “Packages” folder.

Using the build

After installing the package you will find two new options in Tools > Build system of your Sublime menu: SASS and SASS - Compressed.

By default your .scss and .sass files will be built using the SASS build (not compressed).

And remember, always you can launch the selected build with Control+B (Linux/Windows) or Command+B (OS X).

Recommendations

  • Is recommended to use this build with one of the next plugins: SASS plugin or SCSS.tmbundle.
  • Also, I recommend the plugin SublimeOnSaveBuild. Just save your SASS files and transform them into CSS!
  • If you want to change the default folder of your generated CSS files into another one, you can edit the build:

Example: Save your CSS files into a css folder: "cmd": ["sass", "--update", "$file:${file_path}/../css/${file_base_name}.css"],

Author

Created by Jaume Fontal (@jaumefontal).

If you need more info you can find me on Twitter!

Acknowledgments

Thanks to the collaboration of @hdennison with the testing in MacOS.