SASS SCSS LESS compile

Compilers

1. COMPASS

Compass is a powerfull command line compiler

Install (Linux debian) : sudo apt-get install ruby-compass

Link : http://compass-style.org/help/documentation/command-line/

2. Koala

Koala is a SASS / LESS compiler available on Windows, Linux and Mac OSX

3. WinLESS

Winless is a LESS compiler for Windows. it's free and efficient.

SCSS / LESS Configuration with PhpStorm (File Watchers)

1. Add File Watcher (File->Settings->Tools->File Watcher->Add->SCSS)
2. Create new scope to detect your .scss files (Ex: Select and Include Recursively the scss folder)
3. Set Program Path (Ex: /usr/bin/scss) (Install SCSS if not already done)
4. Set Arguments (Ex: --no-cache --update style.scss:style.css)
   
   -> Add other options if you want (--style compressed)
5. Set output paths to refresh (Ex: style.css)
6. Save and Apply

COMPASS Configuration with PhpStorm

1. Install COMPASS

2. Setup File watcher (File -> Settings -> Tools -> File Watchers)

Add new file Watcher and configure:

Example to compile a single scss file:

Program:  /usr/bin/compass

Arguments: compile $FileName$

Working Directory: $FileDir$

3 Create compass config file (config.rb) in the SCSS file directory

Example:

http_path = "/"

css_dir = "."

sass_dir = "."

images_dir = "../images"

javascripts_dir = "../js"

4. When you save the SCSS File, it will compile automatically.

Link : https://www.jetbrains.com/help/phpstorm/2016.1/working-with-sass-and-scss-in-compass-projects.html