例えば、下記のようなフォルダがあり、それぞれに対してタスクを実行したいと考えており、

/scripts
/scripts/jquery/*.js
/scripts/angularjs/*.js

最終的に次のようにしたいのであれば、

/scripts
/scripts/jquery.min.js
/scripts/angularjs.min.js

下記のような処理の実行が必要になります。

var fs = require('fs');
var path = require('path');
var merge = require('merge-stream');
var gulp = require('gulp');
var concat = require('gulp-concat');
var rename = require('gulp-rename');
var uglify = require('gulp-uglify');

var scriptsPath = 'src/scripts';

function getFolders(dir) {
    return fs.readdirSync(dir)
      .filter(function(file) {
        return fs.statSync(path.join(dir, file)).isDirectory();
      });
}

gulp.task('scripts', function() {
   var folders = getFolders(scriptsPath);

   var tasks = folders.map(function(folder) {
      // foldername.jsに連結
      // ファイルを出力
      // minifyの処理
      // folder.min.jsにリネーム
      // 再びファイルを出力
      return gulp.src(path.join(scriptsPath, folder, '/**/*.js'))
        .pipe(concat(folder + '.js'))
        .pipe(gulp.dest(scriptsPath))
        .pipe(uglify())
        .pipe(rename(folder + '.min.js'))
        .pipe(gulp.dest(scriptsPath));
   });

   // scriptsPathのルート内の全ての残りのファイルを、
   // main.jsとmain.min.jsファイルにする処理
   var root = gulp.src(path.join(scriptsPath, '/*.js'))
        .pipe(concat('main.js'))
        .pipe(gulp.dest(scriptsPath))
        .pipe(uglify())
        .pipe(rename('main.min.js'))
        .pipe(gulp.dest(scriptsPath));

   return merge(tasks, root);
});

注意点:

• folders.map - フォルダ毎に関数を実行し、その非同期ストリームを返します。
• merge - ストリームを混ざり合わせて、全てのストリームが終了した場合にのみ終了するようにします。

 Back to top