如何使用gulp替换

时间:2016-08-12 06:56:25

标签: javascript arrays replace gulp gulp-replace

我有一个XML文件,我需要使用GulpJS用数组中的值替换属性值。

JavaScript代码:

var gulp = require('gulp'); 
var replace = require('gulp-replace'); 
gulp.task('default', function() {   
    //array is dynamic
    var users = ["existing_value1", "existing_value2", "existing_value3"];  
    var num = users.length();
    for (i=0;i<num;i++) {
        gulp.src(['idmap/*.xml'])
            .pipe(replace(users[i], 'SYSTEM'))
            .pipe(gulp.dest('build/'));
    } 
});

示例XML:

<?xml version="1.0"?><IDMAP><RECORD>
<TOKEN data = "414"/><NAME data="existing_value1"/></RECORD>
<RECORD><TOKEN data = "420"/><NAME data="existing_value2"/></RECORD>   
<RECORD><TOKEN data = "361"/><NAME data="existing_value3"/></RECORD> 
</IDMAP>

使用此代码,我可以将XML中的字符串替换为数组中的最后一项。如何用数组中的项替换所有项,然后进行构建?

提前致谢!

2 个答案:

答案 0 :(得分:1)

每次 for 循环运行时,它都会覆盖 dest 文件。这就是为什么您只替换了数组中的最后一项

gulp-replace 仅支持StringRegExp作为搜索参数。因此我建议您编写自己的插件。它会是这样的:

var gulp = require('gulp');
var rs = require('replacestream');
var through = require('through2');

gulp.task('default', function() {   
  var users = ["existing_value1", "existing_value2", "existing_value3"];
  gulp.src(['idmap/*.xml'])
    .pipe(replaceArray(users, 'SYSTEM'))
    .pipe(gulp.dest('build/'))
});

/**
 * This is your plugin inspired in gulp-replace
 *
 * @method replaceArray
 * @param  {Array} searchArray
 * @param  {String} replacement
 */
function replaceArray(searchArray, replacement) {
  return through.obj(function(file, encoding, callback) {
    if (file.isStream()) {
      file.contents = searchArray.reduce(function (contents, search) {
        return contents.pipe(rs(search, replacement));
      }, file.contents);
      return callback(null, file);
    }
    if (file.isBuffer()) {
      var result = searchArray.reduce(function (contents, array) {
        return contents
          .split(search)
          .join(replacement);
      }, String(file.contents));
      file.contents = new Buffer(result);
      return callback(null, file);
    }
    callback(null, file);
  });
}

答案 1 :(得分:1)

您可以使用正则表达式执行此操作。如果可以的话,如果你能编写一个匹配你想要的所有属性的模式会更好。例如,这适用于您的示例:

gulp.task('default', function() {
    gulp.src(['idmap/*.xml'])
        .pipe(replace(/existing_value\d+/g, 'SYSTEM'))
        .pipe(gulp.dest('build/'));
});

但是如果您的属性比那些更复杂,您可以从users数组生成动态表达式:

gulp.task('default', function() {

    var users = ['existing_value1', 'existing_value2', 'existing_value3'];
    var regex = new RegExp('\\b' + users.join('\\b|\\b') + '\\b', 'g');

    gulp.src(['idmap/*.xml'])
        .pipe(replace(regex, 'SYSTEM'))
        .pipe(gulp.dest('build/'));

});