What is Sass?

A CSS preprocessor.
A program that takes source code written in one type of language as input, and outputs code that can be understood by another program.

 

Sass Syntax Types

  1. SASS: Indented Syntax (Original) — not CSS code compatible.
  2. SCSS: Sassy CSS (Latest) — fully compatible with the syntax of CSS. Plain CSS syntax is valid.

Installing Sass

1. Install Chocolatey

Chocolatey is a package manager for Windows (like apt-get but for Windows).

  1. Ensure that you are using an administrative command line.
  2. Copy and paste the following code:
@"%SystemRoot%\System32\WindowsPowerShell\v1.0\powershell.exe" -NoProfile -InputFormat None -ExecutionPolicy Bypass -Command "iex ((New-Object System.Net.WebClient).DownloadString('https://chocolatey.org/install.ps1'))" && SET "PATH=%PATH%;%ALLUSERSPROFILE%\chocolatey\bin"
  1. Type choco or choco -? now.

 

2. Install Sass

You can install Dart Sass by running

choco install sass

Windows 7

  1. From the desktop, right click the Computer icon.
  2. Choose Properties from the context menu.
  3. Click the Advanced system settings link.
  4. Click Environment Variables. In the section System Variables, find the PATH environment variable and select it. Click Edit. If the PATH environment variable does not exist, click New.
  5. In the Edit System Variable (or New System Variable) window, specify the value: C:\tools\dart-sdk\bin
  6. of the PATH environment variable. Click OK. Close all remaining windows by clicking OK.
  7. Open command prompt window, and run your code.

Now it should work!

sass --version