問題描述

我正在嘗試基于 jsFiles 對象動態創建任務(縮小和連接).鍵將給出目標文件名，數組包含 src 文件.當我運行 gulp 時，我看到所有任務名稱都在運行，但它只寫入最后一個鍵，在這種情況下是 group2.js.這里有什么問題?

I'm trying to dynamically create tasks (minify and concat) based on jsFiles object. The key will give the destination file name and the array contains the src files. When I run gulp I see all the tasks names being ran but it only writes the last key which is group2.js in this case. What's wrong here?

// imports here

var jsFiles = 
{
    group1:[file1.js,file2.js],
    group2:[file2.js,file3.js]
};

for (var key in jsFiles)
{
    gulp.task(key, function() {
        return gulp.src(jsFiles[key])
        .pipe(jshint())
        .pipe(uglify())
        .pipe(concat(key + '.js'))  // <- HERE
        .pipe(gulp.dest('public/js'));
    });
}

var defaultTasks = [];
for (var key in jsFiles)
{
    defaultTasks.push(key);
}
gulp.task('default', defaultTasks);

推薦答案

另一種選擇是使用函數式數組循環函數結合Object.keys，像這樣:

Another option is to use functional array looping functions combined with Object.keys, like so:

var defaultTasks = Object.keys(jsFiles);

defaultTasks.forEach(function(taskName) {
   gulp.task(taskName, function() {
       return gulp.src(jsFiles[taskName])
          .pipe(jshint())
          .pipe(uglify())
          .pipe(concat(key + '.js'))
          .pipe(gulp.dest('public/js'));
   });
});

我覺得這樣更簡潔一些，因為循環和函數在同一個地方，所以更容易維護.

I feel like this is a little cleaner, because you have the loop and the function in the same place, so it's easier to maintain.

這篇關于使用循環創建任務 [gulp]的文章就介紹到這了，希望我們推薦的答案對大家有所幫助，也希望大家多多支持html5模板網！