gulp: Obtenha uma lista de nomes de arquivos CSS como @imports

Eu criei uma resposta para esta pergunta do SO e estou compartilhando aqui em detalhes.

Problema:
uma grande estrutura de pastas possui vários arquivos .css (isso também funciona para: .styl, .sass, .less).
Um arquivo principal deve ter uma lista de todos os arquivos como @imports.

gulpfile.js

var gulp = require('gulp');
var stylus = require('gulp-stylus');
var mixer = require('./mixer'); // our local gulp-plugin


gulp
.task('mix', function(){
gulp
.src('./src/**/*.styl')
.pipe(mixer("outfile")) // the out file name, no extension.
.pipe(stylus()) // preprocessor
.pipe(gulp.dest('./out')); // the out folder
});

Em seguida, criaremos um plug-in mini gulp para obter a lista de arquivos css como caminhos.

mixer.js

var through = require('through2');
var gutil = require('gulp-util');


module.exports = function(outname){
var paths = ''; // where we will push the path names with the @import

var write = function (file, enc, cb){
if (file.path != "undefined"){
paths
= paths + 'n' + '@import "' + file.path + '"';
}
cb
();
};

var flush = function(cb){ // flush occurs at the end of the concating from write()
gutil
.log(gutil.colors.cyan(paths)); // log it

var newFile = new gutil.File({ // create a new file
base: __dirname,
cwd
: __dirname,
path
: __dirname + '/' + outname + '.styl',
contents
: new Buffer(paths) // set the contents to the paths we created
});

this.push(newFile); // push the new file to gulp's stream
cb
();
};

return through.obj(write, flush); // return it
};

Ele pega todos os caminhos de arquivo e os coloca em uma variável que converterá cada caminho em um @import .

A partir de então, a saída pode ser processada em uma pasta dest ou enviada para um plugin de pré-processador.

Nota: A extensão final do arquivo é modificada com o pré-processador.

Um exemplo de repositório para este projeto pode ser visto aqui: https://github.com/stevelacy/gulp-mix-test