Gulp：ファイルをそれぞれ別々のSassプロセスに連結します

Question

1つのフォルダ内のすべてのscssファイルを個別のcssファイルに処理するgulpタスクを作成しました。

gulp.task('process', function() { 
    gulp.src(['./base.scss', './layout/*.scss']) 
    .pipe(sass()) 
    .pipe(gulp.dest('dist')) 
}); 

今、私は、各scssプロセスに一つのファイル（base.scss）を連結します。これどうやってするの？

Answer 1

これは役に立ちますが、テストしませんでした。 Gulp-foreachはあなたには良いことですが、gulp.srcの各ファイルを別々に操作できる独自のストリームとして扱います。下のコードは、あなたのbase.scssを各ストリームに追加し、それらを連結してから、パイプを通過します。

var foreach = require('gulp-foreach'); 
var concat = require('gulp-concat'); 
var addsrc = require('gulp-add-src'); 

gulp.task('default', function() { 
    return gulp.src('./layout/*.scss') 
     // treats each file in gulp.src as a separate stream 
    .pipe(foreach(function (stream, file) { 
     return stream 
     // append or prepend 
     .pipe(addsrc.append('./base.scss')) 
     // you do have access to the 'file' parameter here if you need to rename 
     .pipe(sass()) 
     .pipe(concat(path.basename(file.path))) 
     .pipe(gulp.dest('dist')); 
    })); 
}); 

あなたに適しているかどうか教えてください。