使用Gulp迭代目录?

Nat*_*man 35 javascript gulp

我是新来吞掉,但我不知道是否可能通过目录中一饮而尽任务迭代.

这就是我的意思,我知道很多教程/演示显示使用类似"**/*.js"的东西处理一堆JavaScript文件,然后将它们编译成单个JavaScript文件.但是我想迭代一组目录,并将每个目录编译成它自己的JS文件.

例如,我有一个文件结构,如:

/js/feature1/something.js
/js/feature1/else.js
/js/feature1/foo/bar.js
/js/feature1/foo/bar2.js
/js/feature2/another-thing.js
/js/feature2/yet-again.js
Run Code Online (Sandbox Code Playgroud)

......我想两个文件:/js/feature1/feature1.min.js/js/feature2/feature2.min.js其中首先包含4个文件,第二个包含最后2个文件.

这是可能的,还是我必须手动将这些目录添加到清单?实用迭代遍历其中的所有目录真的很不错/js/.

感谢你给与我的帮助.

-Nate

编辑:应该注意的是,我不仅有2个目录,但我有很多(可能是10-20个),所以我真的不想为每个目录编写任务.我想以相同的方式处理每个目录:获取其中的所有JS(以及任何子目录)并将其编译为基于特征的缩小JS文件.

Ghi*_*llo 45

这是一个官方配方:每个文件夹生成一个文件

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) {
      return gulp.src(path.join(scriptsPath, folder, '/**/*.js'))
        // concat into foldername.js
        .pipe(concat(folder + '.js'))
        // write to output
        .pipe(gulp.dest(scriptsPath)) 
        // minify
        .pipe(uglify())    
        // rename to folder.min.js
        .pipe(rename(folder + '.min.js')) 
        // write to output again
        .pipe(gulp.dest(scriptsPath));    
   });

   // process all remaining files in scriptsPath root into main.js and main.min.js files
   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);
});
Run Code Online (Sandbox Code Playgroud)


Ben*_*Ben 16

您可以使用glob获取目录列表并迭代它们,使用gulp.src为每个功能创建单独的管道.然后,您可以返回在所有流都已end编辑时已解决的承诺.

var fs = require('fs');
var Q = require('q');
var gulp = require('gulp');
var glob = require('glob');

gulp.task('minify-features', function() {
  var promises = [];

  glob.sync('/js/features/*').forEach(function(filePath) {
    if (fs.statSync(filePath).isDirectory()) {
      var defer = Q.defer();
      var pipeline = gulp.src(filePath + '/**/*.js')
        .pipe(uglify())
        .pipe(concat(path.basename(filePath) + '.min.js'))
        .pipe(gulp.dest(filePath));
      pipeline.on('end', function() {
        defer.resolve();
      });
      promises.push(defer.promise);
    }
  });

  return Q.all(promises);
});
Run Code Online (Sandbox Code Playgroud)