多個文件的吞食任務

Question

我正在嘗試創建一個爲每個項目css創建一個css文件（在這種情況下縮小）的gulp任務。 因此，對於A計劃應該結合起來，然後再縮小以下文件：

global.projecta.css 
tool1.projecta.css 
tool2.projecta.css 

它需要一種循環或什麼的......？如果有新的項目D，它也應該建立它。如果我需要添加一些像「projectd」這樣的數組，那也可以。

這是CSS

./global.projecta.css 
./global.projectb.css 
./global.projectc.css 

./addons/tool1.projecta.css 
./addons/tool2.projecta.css 
./addons/tool1.projectb.css 
./addons/tool2.projectb.css 
./addons/tool1.projectc.css 
./addons/tool2.projectc.css 

的目錄結構這是不工作任務

// not working.... 
gulp.task('css', function() { 
    return gulp.src(['global.*.css', 'addons/tool*.css', '!*.min.css']) 
     .pipe(concat('build.css')) 
     .pipe(rename({suffix: '.min'})) 
     .pipe(minifycss()) 
     .pipe(gulp.dest('build/css')); 
}); 

Answer 1

你可以嘗試這樣的事情，雖然需要手動輸入您的項目的數組。

gulp.task('css', function() { 
    var projects = ['a','b','c']; 
    projects.forEach(function(proj) { 
     gulp.src(['global.' + proj + '.css', 'addons/tool*.' + proj + '.css', '!*.min.css']) 
     ... 
    }); 
}); 

Answer 2

此輸出不同的文件對每個全球項目。對於每個global.project *的CSS將輸出global.project * .min.css：

var gulp = require('gulp'); 
var css = require('gulp-minify-css'); 
var concat = require('gulp-concat'); 
var rename = require('gulp-rename'); 
var glob = require('glob'); 


gulp.task('css', function() { 

    glob('global.\*.css', {}, function (er, files) { 

     for(var i = 0, cnt = files.length; i < cnt; i++){ 
      var fileName = files[i].replace('.css', ''); 
      gulp.src(['global.\*.css', 'addons/tool\*.css', '!*.min.css']) 
       .pipe(concat('build.css')) 
       .pipe(rename({basename: fileName, suffix: '.min'})) 
       .pipe(css()) 
       .pipe(gulp.dest('build/css')); 
     } 
    }); 


}); 


gulp.task('default', ['css']);