gulp-sakugawa (グルプ佐久川)

Run Sakugawa via gulp, for CSS splitting, filtering and organising.

Internet Explorer versions from 6 up to 9 come with a limitation for selectors present in a single CSS file. This limitation of 4095 selectors created the need for CSS splitter, which might be the main use case of this task runner plugin.

Since IE8 and earlier, do not support media queries, but IE9 does, there is an option for handling media queries differently, based on the targeted IE version. By separating media queries in to a different file, it will allow the to include that CSS file conditionally only when IE9 is being used. Ideally this would reduce the amount of bytes downloaded by IE8, which cannot handle the media queries anyhow, and thus prevent downloading something that is not even used.

Internally this gulp task uses Sakugawa, thus in the case of any problems regarding the resulting output or input handling, and also for any feature requests, please refer to the issues at Sakugawa project.

Installation

Please note that Node.js version minimum of 4.2.0 is required to use this plugin.

npm install gulp-sakugawa --save-dev

var gulpSakugawa = require('gulp-sakugawa');

Usage

Example configuration against Pure CSS, which results in two files, pure-min_1.css and pure-min_2.css in which the latter contains all media queries.

var gulp = require('gulp'),
  gulpSakugawa = require('gulp-sakugawa');

gulp.task('default', function() {
  gulp.src('pure-min.css')
    .pipe(gulpSakugawa({
      maxSelectors: 400,
      mediaQueries: 'separate',
      suffix: '_'
    }))
    .pipe(gulp.dest('.'));
});

The CSS file used in the example can be retrieved with:

wget http://yui.yahooapis.com/pure/0.5.0/pure-min.css

Contributing

Please refer to a GitHub blog post on how to create somewhat perfect pull request.

Version history

v0.4.1 (2015-09-03) Output filenames were not as documented, fixed via #10
v0.4.0 (2015-03-11) Update Sakugawa to v0.4.0 which preserves existing @charset rules to all resulting files
v0.3.0 (2015-02-23) Update Sakugawa to v0.3.0 which adds the minSheets` option
v0.2.0 (2014-11-19) First release, directly paired with Speed improvement release of Sakugawa

License

Licensed under the MIT license.

fetimo / gulp-sakugawa