gulp重命名多个文件

gulp rename multiple files

本文关键字：文件 重命名 gulp      更新时间：2023-09-26

我有一个gump脚本来操作一个主html文件，并根据数组将其重命名为多个名称。这是剧本。

    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。有人能告诉我我的代码出了什么问题吗。

不要在循环中生成函数。

您的循环创建了多个传递给rename的函数。这些函数中的每一个都引用相同的变量name。然而，这些函数不会立即执行，而是只有在所有都已创建之后才执行。这意味着所有函数都引用name在循环中的最后一个值。

您需要通过用循环结构替换for循环来创建多个name变量，该循环结构为每个值创建一个新的函数范围，例如Array.forEach。

您还在循环中创建多个流。您应该在将这些流与merge-stream合并后返回，以便gullow可以确定您的任务何时完成。

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);
});

for ... in用于循环遍历对象的键。对于数组，键是索引值（0和1），所以我对生成name2.html感到惊讶——也许它在以前的运行中就已经存在了。

更改为循环for (var i = 0; i < data.length; i++) { ...的索引，或使用path.basename = data[name]; 从数组中获取名称

相关文章：