IMPORTANT: This plugin is no longer in active development. There are a few alternatives out there, but I’ve not tested them out yet.
Once a month at Building Blocks we have an Innovation Day. On these days we have the opportunity to work on fun internal projects, open source projects or generally just read up on the latest tech and improve our skillset and knowledge.
The last two innovation days me and the Spacedawwwg have been working on rewriting BB's Grunt plugin to combine media queries, porting the features to a Node package and wrapping them in a light Grunt task (as it should be!).
I ended up taking our innovation day project a step further and created a simple Gulp wrapper for the task.
Gulp Combine MQ
Now bare in mind that I’d only first played with Gulp the day before I wrote this plugin but it works quite nicely - even though it currently needs a little affection.
Simply install and save as you would any Node package:
npm install --save-dev gulp-combine-mq
And add the following to your
var combineMq = require('gulp-combine-mq'); gulp.src('./src/**/*.css') .pipe(combineMq()) .pipe(gulp.dest('./dist'));