.pipe() 在 gulp 中的 return 有什么作用？

Question

在下面的代码片段中，.pipe(gulpIf('*.css', cssnano())) 的输入和输出是什么？

gulp.task('useref', function(){
  return gulp.src('app/*.html')
    .pipe(useref())
    .pipe(gulpIf('*.js', uglify()))
    .pipe(gulpIf('*.css', cssnano()))
    .pipe(gulp.dest('dist'))
});

API 文档 (link) 说 .pipe(destination) return 是对用于设置链的目标流的引用，如果是这样 .pipe(gulpIf('*.js', uglify())) 将 return 到缩小的 .js 文件的流，如何将其通过管道传输到 .pipe(gulpIf('*.css', cssnano()))？

Answer 1

Gulp 只是一个具有相当简单基本功能的任务运行器。它的力量来自广泛的第三方包生态系统，您自己的代码片段至少使用了四个。我说四个是因为那是在您的 gulpfile.js 源代码中显示的内容； gulp本身有13 direct runtime dependencies:

"dependencies": {
    "archy": "^1.0.0",
    "chalk": "^1.0.0",
    "deprecated": "^0.0.1",
    "gulp-util": "^3.0.0",
    "interpret": "^1.0.0",
    "liftoff": "^2.1.0",
    "minimist": "^1.1.0",
    "orchestrator": "^0.3.0",
    "pretty-hrtime": "^1.0.0",
    "semver": "^4.1.0",
    "tildify": "^1.0.0",
    "v8flags": "^2.0.2",
    "vinyl-fs": "^0.3.0"
},

...以及类似数量的直接开发依赖项。

gulp 传递的流由 vinyl-fs 提供，并不表示单个文件而是虚拟文件系统。

关于您的代码，您肯定只从 HTML 个文件开始：

gulp.src('app/*.html')

... 但紧接着你执行了一个名为 gulp-useref:

的第三方包

.pipe(useref())

根据其文档：

will parse the build blocks in the HTML, replace them and pass those files through. Assets inside the build blocks will be concatenated and passed through in a stream as well.

换句话说，它将 HTML 文件解析为 identify/generate 资产文件，并将它们添加到流中以供进一步处理。

.pipe() 在 gulp 中的 return 有什么作用？

What does a .pipe() function return in gulp?

javascript

node.js

npm

gulp

npmjs