SUIT CSS with Sass & PostCSS

This is an example of writing SUIT components with Sass and then using gulp and PostCSS to handle the tooling

A copy of the my existing SUIT CSS with Stylus but working with Sass

How it works

Using gulp the SUIT components (written as Sass files) are compiled into CSS, linted with the SUIT conformance tool and then built with postcss-import and cssnext. A single file is the result.

Additional plugins can be added easily.

Caveat

Using libsass means that the output of a sass file has the @import above the /** @define Component */ comment. This stops the BEM Linter working.

To circumvent this consider handling all imports in the main.scss instead of at a per file level.

Using the Ruby Sass does not have this issue.

An issue has been raised sass/libsass#1080