用gulp生成文件
我有一个名为setup.js文件，位于我的/src文件夹的各个子文件夹中。 我想要一个setup.js任务将所有setup.js文件复制到/dist文件夹并保留子文件夹结构。 这部分很简单。
棘手的部分是我还想在\dist文件夹中的每个setup.js文件旁边生成一个index.html文件。 除了需要使用相对于/dist文件夹的path引用setup.js脚本之外，index.html文件将完全相同。 我知道我可以使用一些像gulp模板dynamic呈现一个html文件，但我不知道如何将setup.jspathsetup.js给它。 我不知道如何为每个setup.js创build一个index.html 。
所以我要做的结果文件夹结构看起来像这样
/src template.html /blah1 setup.js /blah2 setup.js /dist /blah1 setup.js index.html /blah2 setup.js index.html
任何想法，我将如何做到这一点？
另外如果有人可以链接我一些详细的文档/示例/教程在Gulp可能解释如何去做这样的东西，我将不胜感激。 我还没有find很多很好的文章来解释Gulp幕后发生的事情，而且很难find超出微不足道的范例src | uglify | concat | dest src | uglify | concat | dest src | uglify | concat | dest用例。
谢谢！
我当然不是吞噬或节点的专家，所以随时纠正我/添加到我的答案…
我试图复制一个类似的目录结构到你在这里描述的…
使用吞咽水龙头和吞咽模板
gulpfile.js
var gulp = require('gulp'); var template = require('gulp-template'); var tap = require('gulp-tap'); gulp.task('default', function () { gulp.src('./src/**/**.js', { base: './src' }) // tap into the stream to get the current file and compile // the template according to that .pipe(tap(function (file) { gulp.src('./src/template.html') // compile the template using the current // file.path as the src attr in the template file .pipe(template({ sourcefile: file.path })) // not sure about this line but I'm sure it could be better // splits the path on the / and then uses the second to last // item in the split array (which is the current directory, minus src plus dist) .pipe(gulp.dest('./dist/' + file.path.split('/')[file.path.split('/').length - 2])) })) // finally put the javascript files where they belong .pipe(gulp.dest('./dist')) });
template.html
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <script src="<%- sourcefile %>"></script> </head> <body> </body> </html>
开始目录结构
. |____dist |____gulpfile.js |____src | |____bar | | |____setup.js | |____foo | | |____setup.js | |____template.html
最终目录结构
. |____dist | |____bar | | |____setup.js | | |____template.html | |____foo | | |____setup.js | | |____template.html |____gulpfile.js |____src | |____bar | | |____setup.js | |____foo | | |____setup.js | |____template.html
我没有看到@ brbcoding的解决scheme，所以我最终提出了这个解决scheme。 我想我喜欢他的用法，
var gulp = require('gulp'); var through = require('through2'); var fs = require('fs'); var path = require("path"); var lodash = require('lodash'); var replaceWithFile = function(filePath, outName) { return through.obj(function(file, encoding, callback) { var gulpContext = this; fs.readFile(filePath, 'utf8', function(err,data) { file.contents = new Buffer(data); file.path = path.join(path.dirname(file.path), outName); gulpContext.push(file); callback(); }); }); }; var template = function(data, options) { return through.obj(function(file, encoding, callback) { var resolvedData = {}; for (key in data) { if(typeof data[key] === 'function') { resolvedData[key] = data[key](file); } else { resolvedData[key] = data[key]; } } file.contents = new Buffer(lodash.template(file.contents.toString(), resolvedData, options)); this.push(file); callback(); }); }; gulp.task('test', function() { gulp.src('src/**/setup.js') .pipe(replaceWithFile('src/indexTemplate.html', 'index.html')) .pipe(template({ challengeFolder: function(file) { return path.dirname(file.relative); } })) .pipe(gulp.dest('out1')); });