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