Iterate through multiple folders to compile all SASS to CSS in Gulp - gulp

Question

I currently have a file structure like this
projects
sites
site-example
css
scss
site-second-example
css
scss
site-third-example
css
scss
***
site-fifty-example
css
scss
I'm trying to write a gulp task that I can run from the projects folder that will look inside the sites folder, and then go through each folder separately, look for any scss files, and then compile them to css.
I tried to follow this recipe but I must be messing it up somehow:
https://github.com/gulpjs/gulp/blob/master/docs/recipes/running-task-steps-per-folder.md
gulpfile.js
var gulp = require('gulp');
var sass = require('gulp-sass');
var sourcemaps = require('gulp-sourcemaps');
var fs = require('fs');
var path = require('path');
var merge = require('merge-stream');
var postcss = require('gulp-postcss');
var autoprefixer = require('autoprefixer');
var output = './**/css';
var sassOptions = {
errLogToConsole: true,
outputStyle: 'expanded'
};
var scriptsPath = './sites';
function getFolders(dir) {
return fs.readdirSync(dir)
.filter(function(file) {
return fs.statSync(path.join(dir, file)).isDirectory();
});
}
gulp.task('sass', function() {
var processors = [
autoprefixer({
browsers: ['last 12 versions']
})
];
var folders = getFolders(scriptsPath);
var tasks = folders.map(function(folder) {
return gulp.src(path.join(scriptsPath, folder, '/**/*.scss'))
.pipe(sourcemaps.init())
.pipe(sass(sassOptions).on('error', sass.logError))
.pipe(postcss(processors))
.pipe(sourcemaps.write('./maps'))
.pipe(gulp.dest(output));
});
return merge(tasks);
});

Answer 1

You can't put a globstar ** in your destination directory like this:
var output = './**/css';
That won't work, because gulp.dest() can't magically guess from context which directory you want your files to end up in.
You have to explicitly construct a destination directory for each folder returned from getFolders(), just as you do for gulp.src():
var tasks = folders.map(function(folder) {
var src = path.join(scriptsPath, folder, 'scss');
var dst = path.join(scriptsPath, folder, 'css');
return gulp.src(path.join(src, '**/*.scss'))
.pipe(sourcemaps.init())
.pipe(sass(sassOptions).on('error', sass.logError))
.pipe(postcss(processors))
.pipe(sourcemaps.write('./maps'))
.pipe(gulp.dest(dst));
});