Question

我有一个gulp任务

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

}

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

是否可以选择将其设置为每次编译，或者使用不同的插件来执行此操作。

Answer 1

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

这就是它的工作原理：它将获取流中的所有文件，处理它们并将它们“连续”发送到下一个管道。

这就是为什么你的函数getClassName只执行一次。

我想要完成你想要的东西，你必须考虑独立操纵每个文件，因此，你将吞下“吞噬”的力量。

拥有每个文件路径后，您可以在此文件上运行任务（现在是一个函数）。该任务基本上将提取流中每个文件的路由并调用functioncompileMarkdown，这是您的“旧”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)];
}

将随机值传递给gulp pipe模板

1 个答案: