Developing with SASS using PHPStorm on Windows

Question

I'm running PHPStorm IDE on Windows.

I would like to start using Zurb Foundation and write my stylesheets using SCSS. Do I need to install Ruby or Compass to do so?

Is there a way to let PHPStorm automatically compile .css stylesheets for me in my projects (in custom paths for each project) whenever I edit a .scss file?

I've seen this http://www.jetbrains.com/phpstorm/webhelp/transpiling-sass-less-and-scss-to-css.html but looks like the instructions are for a unix system, while I run windows.

So far I did the following:

1. I've installed http://rubyinstaller.org/ then
2. successfully installed the sass and compass gems in the ruby/bin folder
3. After this I pointed went to Project Settings in PHPStorm and told where to look for Compass

At this point what should I do? Define a config.rb for my project with Compass variables for where to look for SASS files and where to compile them? What else should I do?

Answer 1

If you are not using compass-specific stuff like its specific functions and mixins, I'd suggest using SASS transpiler to create CSS out of SCSS.

SCSS file watcher settings are rather simple, and you don't need any rb files being created.

Something like:

Program: C:\Ruby193\bin\scss.bat
Arguments: --no-cache --update $FileName$:$FileNameWithoutExtension$.css
Working directory: $FileDir$
Output paths: $FileNameWithoutExtension$.css

Note that, as @LazyOne has mentioned, you need to have C:\Ruby193\bin in your PATH to make this work.