Stylus vs SASS vs LESS error reporting

I was curious what SASS did as far as error reporting goes, so I tried the following snippet with SASS, LESS as well as Stylus.

body {
  form input {
    background: foo[fail];
  }
}

LESS

The output from LESS was terrible:

  Syntax Error on line 4

note: that for LESS I had to tweak the input to “foo[fail’]’;” since it simply consumes the input above

SASS

The SASS output was not bad, it shows you a tiny chunk of the line for context:

Syntax error: Invalid CSS after "...background: foo": expected ";", was "[fail];"
        on line 4 of standard input
  Use --trace for backtrace.

note: —trace is for the ruby stack trace, not SASS

Stylus

Then we have Stylus, showing you ~8 lines of context (by default), and even a detailed stack trace including the call sites much like you would find in other languages.

    Error: /tmp/stylus/test.styl:4
       1| 
       2| body {
       3|   form input {
     > 4|     background: foo[fail];
       5|   }
       6| }
       7| 

    cannot perform foo[(fail)]
        at "form input" (/tmp/stylus/test.styl:4)
        at "body" (/tmp/stylus/test.styl:3)

Notes

  1. tjholowaychuk posted this