What is Stylus
- Stylus is a CSS pre-processor for Node.js
- Similar pre-processors include LESS and SASS
Pre-processors
-
Definition - a computer program that modifies data to conform with the input requirements of another program.
- Different pre-processors
- HTML - HAML, Markdown
- CSS - Stylus, LESS, SASS
- JS - CoffeeScript, RedScript
Benefits
- Helps you write code faster
- Removes inefficiencies (makes you code better, you don't repeat yourself)
- It's easy to write
Getting started
- Require Node.js - http://nodejs.org
- Installs via NPM
- run `npm install -g stylus`
- Compiling + Watching
- run `stylus -o lib -w src` (this watches a directory called "src" and places the compiled CSS in a folder called "lib")
Syntax
- {} not required
- : not required
- ; not required
- nested code is tabbed
- functions - reusable bits of css