javascript - 将连接的 Gulp 流 file.contents 管道连接到服务器(connect、express 或 http)响应

Question

我怀疑这是由于对流的理解有限，但我到处都看过，但无法让它发挥作用。简而言之，我想采用 Gulp 流并将流的串联内容直接而不写入文件系统以传递给明确的响应。

这就是我的想法(效果很好):

app.get('*', function(req, res){
    var stream = fs.createReadStream(__dirname + '/app/index.html');
    stream.pipe(res);
});

但我想使用 Gulp 流来应用相同的概念:

app.get('/app/js/concatenated-js-files.js', function(req, res){
    gulp.src('app/js/**/*.js')
        .pipe(concat())
        .pipe(res);
});
app.listen(5555, function() {
    console.log('Listening on port 5555');
});

当从浏览器请求 /app/js/concatenated-js-files.js 时，它不起作用并产生以下内容:

[gulp] Error in plugin 'gulp-concat': Missing fileName option for gulp-concat
    at module.exports (/Users/lgomez/Projects/index-packager/node_modules/gulp-concat/index.js:10:24)
    at Object.handle (/Users/lgomez/Projects/index-packager/index.js:83:15)
    at next_layer (/Users/lgomez/Projects/index-packager/node_modules/express/lib/router/route.js:103:13)
    at Route.dispatch (/Users/lgomez/Projects/index-packager/node_modules/express/lib/router/route.js:107:5)
    at /Users/lgomez/Projects/index-packager/node_modules/express/lib/router/index.js:213:24
    at Function.proto.process_params (/Users/lgomez/Projects/index-packager/node_modules/express/lib/router/index.js:284:12)
    at next (/Users/lgomez/Projects/index-packager/node_modules/express/lib/router/index.js:207:19)
    at Layer.expressInit [as handle] (/Users/lgomez/Projects/index-packager/node_modules/express/lib/middleware/init.js:23:5)
    at trim_prefix (/Users/lgomez/Projects/index-packager/node_modules/express/lib/router/index.js:255:15)
    at /Users/lgomez/Projects/index-packager/node_modules/express/lib/router/index.js:216:9

该错误是预期的。 gulp-concat被写入输出到文件。

我想避免编写与 gulp-concat 非常相似的 gulp 插件。我可能会 fork 并提出建议，但就目前而言，还有另一种方法可以实现这一目标吗？

谢谢!

如果您想尝试一下，这里是完整的代码。

var express = require('express');
var gulp    = require('gulp');
var concat  = require('gulp-concat');
var app     = express();
app.get('/app/js/concatenated-js-files.js', function(req, res){
    gulp.src('app/js/**/*.js')
        .pipe(concat())
        .pipe(res);
});
app.listen(5555, function() {
    console.log('Listening on port 5555');
});
// http://localhost:5555/app/js/concatenated-js-files.js

Answer 1

gulp适用于虚拟文件对象流，而不是物理文件。因此，gulp-concat无论您给它起什么名字，它都不会写入文件系统。但是，您仍然会遇到问题，因为您无法将这些文件对象直接发送到 res响应。

您需要将虚拟文件的内容写入res .一个简单的方法是使用 through创建一个读取 gulp 输入并将文件内容写入 res 的流.如果您的流处理多个文件，那么您不需要 concat .

var through = require('through');

// create a stream that reads gulp File objects and outputs their contents
function sendTo(res) {   
    return through(
        function write(data) {    // this will be called once for each file
            res.write(data.contents);
        },
        function end() {    // this will be called when there are no more files
            res.end()
        }
    );
}

app.get('/app/js/concatenated-js-files.js', function(req, res){
    gulp.src('app/js/**/*.js')
        .pipe(sendTo(res));
});

此外，gulp内部使用 vinyl-fs读取文件，所以如果没有其他需要，可以直接使用 vinyl-fs gulp .