gulp複数のファイルの名前を変更

Question

私はマスターhtmlファイルを操作し、配列に基づいていくつかの名前に名前を変更するgulpスクリプトを持っています。ここにスクリプトがあります。

gulp.task('default', function() { 
     var data = ['name1','name2']; 
     for(var name in data){    
     gulp.src('src/master.html') 
      .pipe(*dosomething...*) 
      .pipe(rename(function(path) { 
       path.basename = name; 
       path.extname = '.html'; 
      })) 
     .pipe(gulp.dest('dist')); 
     } 
    }); 

ただし、name2.htmlだけが生成されます。誰でも自分のコードに何が間違っているのか教えてもらえますか？

Answer 1

Don't make functions within a loopを使用してアレイから名前を得ます。

ループは、renameに渡す複数の関数を作成します。これらの関数のそれぞれは、同じ変数nameを参照しています。しかし、これらの関数はすぐに実行されるのではなく、のすべてがのものが作成された後にのみ実行されます。つまり、すべてあなたの関数は、ループ内に最後にあるnameの値を参照しています。

複数のname変数を作成する必要があります。forループを各値に新しい関数スコープを作成するループ構造に置き換えます。 Array.forEach。

ループ内に複数のストリームも作成しています。これらのストリームをmerge-streamとマージして戻す必要があります。そのため、ギャルプはdetermine when your task has finishedです。

var gulp = require('gulp'); 
var rename = require('gulp-rename'); 
var merge = require('merge-stream'); 

gulp.task('default', function() { 
    var data = ['name1','name2']; 
    var streams = []; 
    data.forEach(function(name) { 
    var stream = gulp.src('src/master.html') 
     .pipe(rename(function(path) { 
     path.basename = name; 
     path.extname = '.html'; 
     })) 
     .pipe(gulp.dest('dist')); 
    streams.push(stream); 
    }); 
    return merge(streams); 
}); 

Answer 2

for ... inは、オブジェクトのキーをループするためのものです。配列の場合、キーはインデックス値（0と1）なので、name2.htmlはまったく生成されていると思います。

いずれループfor (var i = 0; i < data.length; i++) { ...ためのインデックス付きに変更したり、path.basename = data[name];