Can I use a Gulp task with multiple sources and multiple destinations?

Question

I have the following in my gulpfile.js:

   var sass_paths = [
        \'./httpdocs-site1/media/sass/**/*.scss\',
        \'./httpdocs-site2/media/sass/**/*         


        

Answer 1

For the ones that ask themselves how can they deal with common/specifics css files (works the same for scripts), here is a possible output to tackle this problem :

var gulp = require('gulp');
var concat = require('gulp-concat');
var css = require('gulp-clean-css');

var sheets = [
    { src : 'public/css/home/*', name : 'home.min', dest : 'public/css/compressed' },
    { src : 'public/css/about/*', name : 'about.min', dest : 'public/css/compressed' }
];

var common = {
    'materialize' : 'public/assets/materialize/css/materialize.css'
};

gulp.task('css', function() {
    sheets.map(function(file) {
        return gulp.src([
            common.materialize, 
            file.src + '.css', 
            file.src + '.scss', 
            file.src + '.less'
        ])
        .pipe( concat(file.name + '.css') )
        .pipe( css() )
        .pipe( gulp.dest(file.dest) )
    }); 
});

All you have to do now is to add your sheets as the object notation is constructed.

If you have additionnal commons scripts, you can map them by name on the object common, then add them after materialize for this example, but before the file.src + '.css' as you may want to override the common files with your customs files.

Note that in the src attribute you can also put path like this :

'public/css/**/*.css'

to scope an entire descendence.