Post 66: How to SASS

How to use SASS?

SASS stands for "Syntactically Awesome Stylesheets Sass". It is a CSS preprocessor and offers you stuff you can't do normally with CSS, e.g. mixins, loops, inheritence.

1. Create a new folder and "npm init"
2. "npm install node-sass"
3. Create a new folder "css" on the same level as "package.json"
4. Go to your package.json and write in the scripts key "start": "node-sass -o css scss"
5. Create a new folder "scss" and create a new file scss "main.scss" in it
6. In the main.scss file write:

.red { color: red; }

.red-dark { color: darken(red, 20%);}

    7. Go to your terminal and write "npm start"

    8. A new file "main.css" was created in the folder "css" for you.