How to use SASS with Netbeans 8.0.1

Yes, when you save the file, the css should be created/updated. I think you have wrong mapping for the input/output directories. The paths need to be relative to site root/web root. I don't know for sure what your project is (HTML5 or PHP or Java Web or other?), but if you have Java Web project, then the paths need to be

resources/scss -> resources/css

Salam guys, the below image form my (Command Prompt with Ruby) says that: "Ruby Sass has reached end-of-life and should no longer be used" enter image description here


Installing SASS on Windows10, Ruby2.2.3, Netbeans8

  1. Download SASS for Windows - RubyInstaller.org
  2. Install Ruby like:

Installing SASS in Netbeans

  1. Search windows for CMD (Command Prompt) and start it.
  2. Access Ruby's bin folder using cd \Ruby\bin (Hit Enter)
  3. Install sass using the command gem install sass (Hit Enter to install)

Installing SASS in Netbeans

  1. Wait for the installation to finish

Installing SASS in Netbeans

  1. In Netbeans open
    Options → Tools → Miscellaneous (HTML/JS in v8.1+) → CSS Preprocessors tab
  2. Enter the path to the installed sass.bat C:\Ruby\bin\sass.bat than click Install Sass.
    Confirm your changes with Apply / OK

Installing SASS in Netbeans

  1. Use an existing one or Create a New Project (HTML5, PHP, whatever...).
    After the project is created open the Projects window.
    Right-Click your project and choose > Properties.
    From the Project Properties popup select CSS Preprocessors.
    Select the Compile SASS Files on Save.
    (If you want the compiler to automatically minimize your .css result file, use --style compressed under the Compiler Options)

Installing SASS in Netbeans

  1. You can see from the image above that the compiler uses two default Input(watchable)/Output(compiled destionation) folders paths.
    Create the scss folder (an optionally the css folder) in your project as well.

Installing SASS in Netbeans

You're done!

As soon you create a new .scss file or you save it Netbeans will automatically compile the file to .css in the /css folder.

Installing SASS in Netbeans

Tags:

Netbeans

Sass