ガルプあまり他の人が

Question

は私が

gulp.task('less', function() { 
    return gulp.src(['./Content/css/**/*.less']) 
     .pipe(less({ 
      paths: [path.join(__dirname, 'less', 'includes')] 
     })) 
     .pipe(gulp.dest(paths.webroot + 'css')); 
}); 

を行う出力

main.css 
other1.css 
other2.css 
other3.css 

は実際にそれが少ないため、CSSを生成し、必要私は

main1.less 
main2.less 
main3.less 
other1.less 
other2.less 
other3.less 

があると分離させ、複数のファイルを結合ファイル...複数のファイルを1つにまとめ、他のファイルを別々のファイルにまとめる方法はありますか？

Answer 1

gulp-concatを使用して、目的のスタイルを別のタスクの1つのファイルに結合することができます。

const gulp = require('gulp4'); 
const less = require('gulp-less'); 
const concat = require('gulp-concat'); 
const path = require('path'); 
const config = { 
    paths: [ path.join(__dirname, 'less', 'includes') ] 
}; 

gulp.task('less:separate',() => gulp 
    .src(path.join(__dirname, 'Content', 'css', '**', 'other*.less')) 
    .pipe(less(config)) 
    .pipe(gulp.dest(paths.webroot + 'css'))); 

gulp.task('less:together',() => gulp 
    .src(path.join(__dirname, 'Content', 'css', '**', 'main*.less')) 
    .pipe(less(config)) 
    .pipe(concat('main.css')) // combine them into one file 
    .pipe(gulp.dest(paths.webroot + 'css'))); 

gulp.task('less', gulp.parallel('less:separate', 'less:together'));