将随机值传递到gulp管道模板

user254694 发表于 Dev

用户254694

我有一个大任务

gulp.task('markdown', function () {
    gulp.src('content/*.md')
        .pipe(newer('assembler/markdown_out'))
        .pipe(markdown())
        .pipe(wrap({ src: 'assembler/markdowntemp/wrapper.html'}))
        .pipe(fileinclude({
            prefix: '@@',
            basepath: '@file'
        }))
        .pipe(template({classname: getClassName()}))
        .pipe(gulp.dest('assembler/markdown_out'));
});

函数getClassName是

function getClassName(){
 var classnames_size = ["big", "medium", "small", "extrabig"];

 var classShape = ["tvscreen", "oval"];

 return classnames_size[Math.floor(Math.random()*classnames_size.length)] + " " + classShape[Math.floor(Math.random()*classShape.length)];

}

不幸的是，当我运行此任务时，它看起来好像模板只被编译了一次，而我想要为每个传入的文件编译模板的东西，这样我就可以生成随机的类名。

是否可以选择将其设置为每次编译，还是可以使用其他插件来进行编译。

Avcajaraville

方法的主要问题是gulp使用“一个glob并表示一个文件结构”（gulp官方文档）。

因此，它是这样工作的：它将获取流中的所有文件，对其进行处理，然后将它们“连续”发送到下一个管道。

这就是为什么您的函数getClassName仅执行一次。

为了完成您想要的工作，您必须考虑独立地操作每个文件，因此，您将大吃一惊。

有了每个文件路径后，就可以在该文件上运行任务（现在是一个函数）。该任务基本上将提取流中每个文件的路由，并调用函数compileMarkdown，这是您的“老” gulp任务。现在，这将对每个文件执行一次，因此，您的getClassName函数将对每个文件执行一次，从而生成“随机类”（认真研究该函数，我依靠的是工作正常的事实）。

本示例使用以下插件：https : //www.npmjs.org/package/glob-to-vinyl/以便处理流中的每个文件。

这是代码，希望对您有所帮助！

var gulp = require('gulp'),
    globToVinyl = require('glob-to-vinyl');

gulp.task('markdown', function() {
  globToVinyl('content/*.md', function(err, files){
    for (var file in files) {
      compileMarkdown(files[file].path);
    }
  });
});

function compileMarkdown(file) {
  gulp.src('file')
    .pipe(newer('assembler/markdown_out'))
    .pipe(markdown())
    .pipe(wrap({ src: 'assembler/markdowntemp/wrapper.html'}))
    .pipe(fileinclude({
        prefix: '@@',
        basepath: '@file'
    }))
    .pipe(template({classname: getClassName()}))
    .pipe(gulp.dest('assembler/markdown_out'));
}

function getClassName(){
  var classnames_size = ["big", "medium", "small", "extrabig"];
  var classShape = ["tvscreen", "oval"];
  return classnames_size[Math.floor(Math.random()*classnames_size.length)] + " " + classShape[Math.floor(Math.random()*classShape.length)];
}