Question

重点是阅读someFolder中的所有文件，然后使用gulp-inject-string 的固定文件将其注入此问题的无关标准。

我所拥有的一些伪代码：

＆＃13;

var gulp = require('gulp');
var inject = require('gulp-inject-string');
var fs = require("fs");

gulp.task('compile', function() {
  
	/* reading the file names in the directory */
	var fileNames = fs.readdirSync('someFolder', 'utf8');
	fileNames.forEach(function(fileName) {
      
		/* getting the whole file content and then removing what 
		I don't want to be injected with a regex */
		var wholeFile = fs.readFileSync('someFolder/' + fileName, 'utf8');
		var file = wholeFile.replace(/<!-- COMMENT-WITH-SOME-FIXED-STRING:. * -->[\r\n]/g, '');
      
		/* now getting into mainFile to inject this file */
		gulp.src('mainFolder/mainFile.html')
        
		/* injecting the content after it has been processed by the regex exactly where I need it
		(which depends on the fileName I got earlier) */
		.pipe(inject.afterEach('<!-- COMMENT-WITH-SOME-FIXED-STRING+FILENAME: ' + fileName + ' -->', file))
		.pipe(gulp.dest('mainFolder'));
      
	});
});

＆＃13;

如果someFolder中只有1个文件，则此方法可正常工作，否则只会注入最后一个读取文件。

我试图将流吸收到一个匿名函数中，在一个常见的for循环中做类似的事情：

for(var i...){ (function(i){ /* stream stuff here*/ })(i) }因为我在javascript中使用异步操作已多次完成，但结果完全相同。

我还尝试使用merge-stream映射一个函数而不是fileNames，它返回流本身，然后应用合并，但同样的结果。

尝试处理流时我做错了什么？

Answer 1

这是有用的：

var gulp = require('gulp');
var inject = require('gulp-inject-string');
var fs = require("fs");

gulp.task('compile', function() {
    /* reading the file names in the directory */
    var fileNames = fs.readdirSync('someFolder', 'utf8');
    var stream = gulp.src('mainFolder/mainFile.html');
    fileNames.forEach(function(fileName) {
        var file = fs.readFileSync('someFolder/' + fileName, 'utf8');

        stream = stream.pipe(inject.afterEach('<!-- include: ' +
                                              fileName + ' -->', file));

    });
    return stream.pipe(gulp.dest('destFolder'));
});

我没有在mainFolder/mainFile.html上完成文本替换，因为它不是导致失败的原因，而且添加起来很简单。我也将输出发送到另一个文件夹（destFolder），因为我绝对讨厌修改输入的gulpfiles。它使调试这样的gulpfiles非常困难。

关键是：

您需要向Gulp返回一些内容，以便知道您的任务何时结束。否则，可能在任务结束之前终止。
您必须返回链接流上所有操作的结果。
通常可以在单个流中包含多个gulp.dest，但在这种情况下，您应该只使用一个gulp.dest，否则，您将只获得部分结果。

考虑以下输入。

$ cat mainFolder/mainFile.html 
<!-- include: a -->
Other stuff.
<!-- include: b -->
Other stuff.
<!-- include: a -->
Other stuff.
<!-- include: b -->

$ cat someFolder/a 
File a's contents.

$ cat someFolder/b 
File b's contents.

运行gulp compile会产生：

$ cat destFolder/mainFile.html 
<!-- include: a -->File a's contents.

Other stuff.
<!-- include: b -->File b's contents.

Other stuff.
<!-- include: a -->File a's contents.

Other stuff.
<!-- include: b -->File b's contents.

Answer 2

不是将fs用于目录和文件，而是让gulp.src为您完成，然后将每个文件注入主文件。

gulp.src('someFolder/*.*')  // or a specific file type
  .pipe(inject.afterEach('someCriteriaInTheMainFile', file))
  .pipe(gulp.dest('mainFileFolderContainer'));

Gulp任务：循环内部的流

2 个答案: