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/**/*.scss',         './httpdocs-site3/media/sass/**/*.scss'     ];  gulp.task('sass', function() {     return gulp.src(sass_paths)         .pipe(sass({errLogToConsole: true}))         .pipe(autoprefixer('last 4 version'))         .pipe(minifyCSS({keepBreaks:true}))         .pipe(rename({ suffix: '.min'}))         .pipe(gulp.dest(???)); }); 

I'm wanting to output my minified css files to the following paths:

./httpdocs-site1/media/css ./httpdocs-site2/media/css ./httpdocs-site3/media/css 

Am I misunderstanding how to use sources/destinations? Or am I trying to accomplish too much in a single task?

Edit: Updated output paths to corresponding site directories.

Answer 1

I guess that the running tasks per folder recipe may help.

Update

Following the ideas in the recipe, and oversimplifying your sample just to give the idea, this can be a solution:

var gulp = require('gulp'),     path = require('path'),     merge = require('merge-stream');  var folders = ['httpdocs-site1', 'httpdocs-site2', 'httpdocs-site3'];  gulp.task('default', function(){      var tasks = folders.map(function(element){         return gulp.src(element + '/media/sass/**/*.scss', {base: element + '/media/sass'})             // ... other steps ...             .pipe(gulp.dest(element + '/media/css'));     });      return merge(tasks); }); 

Answer 2

you are going to want to use merge streams if you would like to use multiple srcs but you can have multiple destinations inside of the same one. Here is an example.

var merge = require('merge-stream');   gulp.task('sass', function() {    var firstPath = gulp.src(sass_paths[0])                .pipe(sass({errLogToConsole: true}))                .pipe(autoprefixer('last 4 version'))                .pipe(minifyCSS({keepBreaks:true}))                .pipe(rename({ suffix: '.min'}))                .pipe(gulp.dest('./httpdocs-site1/media/css'))                .pipe(gulp.dest('./httpdocs-site2/media/css'));    var secondPath = gulp.src(sass_paths[1])                .pipe(sass({errLogToConsole: true}))                .pipe(autoprefixer('last 4 version'))                .pipe(minifyCSS({keepBreaks:true}))                .pipe(rename({ suffix: '.min'}))                .pipe(gulp.dest('./httpdocs-site1/media/css'))                .pipe(gulp.dest('./httpdocs-site2/media/css'));    return merge(firstPath, secondPath); }); 

I assumed you wanted different paths piped here so there is site1 and site2, but you can do this to as many places as needed. Also you can specify a dest prior to any of the steps if, for example, you wanted to have one dest that had the .min file and one that didn't.