Up until recently, I’ve been using LESS as my CSS preprocessor. When I first became aware of the existence of CSS preprocessors, I was trying to find one that would suit be best.
One day I decided to make the plunge and see what Sass really had to offer. I’ve come to love the powerful features of Sass and Compass, and I’m not looking back.
It’s not hard at all to install Ruby on Windows. All you need to do is visit the Ruby Installer website and grab the latest version of the installer. Download the file to your system and execute it.
Remember to check “Add Ruby executables to your PATH”, otherwise you won’t be able to run Ruby from command prompt.
Open your preferred terminal; Git Bash and Windows Command Prompt both work fine. Run the following command:
gem install compass
This will download Compass and its required dependencies, including Sass.
Now you have Compass installed, you can create and compile your own Compass projects. See the Compass website for information on generating a new Compass project. To compile an existing Compass project,
cd into the project directory and run
compass compile to compile modified Sass files. If you’re consistently making edits, run
compass watch which will watch for changes in that folder and compile any files that are modified.
An advantage on installing Ruby is you can install Compass plugins such as Susy or Compass Normalize which can extend Compass in new ways. These can be installed in the same was as Compass using the
gem install susy
gem install compass-normalize
Compass includes plain-ruby gem for its excellent sprite generating functionality. You can install a new gem which will speed up the process. To do so, you will need the Ruby DevKit to be installed.
Download Ruby DevKit from the same website as before. Use 7-Zip to extract the archive to a place of your choosing;
C:/Ruby/DevKit (or similar) will work fine.
cd into that directory and run:
ruby dk.rb init
ruby dk.rb install
Now you should be able to install the OilyPNG gem to speed up sprite generation:
gem install oily_png
Compass will automatically detect and use this gem.
Feel free to post a comment below. I will respond to all requests.