乙烯缓冲剂和吞咽吞咽的目的是什么？ [英] What are the purposes of vinyl-buffer and gulp-streamify in gulp?

问题描述

我的理解是，如果我可以使用 .pipe（）方法在某些事物上，是不是表示它是一个流？

如果是这样，我该怎么转换什么在这里？

vinyl-source-stream 例子：

（from： https://www.npmjs.com/package/vinyl-buffer ）

  var browserify = require（'browserify'）
 var source = require（'vinyl-source-stream'）
 var buffer = require 'vinyl-buffer'）
 var uglify = require（'gulp-uglify'）
 var size = require（'gulp-size'）
 var gulp = require（'gulp'）
 
 gulp.task（'build'，function（）{
 var bundler = browserify（'./ index.js'）
 
r eturn bundler.pipe（）
 .pipe（source（'index.js'））
 .pipe（buffer（））//< ------------- ---------为什么？ 
 .pipe（uglify（））
 .pipe（size（））
 .pipe（gulp.dest（'dist /'））
}）
  

gulp-streamify 示例：

（from： https://www.npmjs.com/package/vinyl-source-stream ）

  var source = require（'vinyl-source-stream'）
 var streamify = require（'gulp-streamify'）
 var browserify = require（'browserify'）
 var uglify = require（'gulp-uglify'）
 var gulp = require（'gulp'）
 
 gulp。 task（'browserify'，function（）{
 var bundleStream = browserify（'index.js'）。bundle（）
 
 bundleStream 
 .pipe（source（'index。 js'））
 .pipe（streamify（uglify（）））//< ----------- why？
 .pipe（gulp.dest（'./ bundle .js'））
}）
  

解决方案

一个半有用的例子是考虑用一桶水来放一个篝火。为了扑灭火灾，您需要在将垃圾倒入火中之前完全填满垃圾桶，而不是在垃圾桶中滴几滴水，然后随着时间的推移在火上倾倒大量的小滴。这个比喻并没有抓住所有的东西，但最大的想法是这样的：你需要一大桶水，然后才能灭火。

这个uglify插件工作正常一样的方法。想象一下你想要压缩/ uglify的一些巨大的JS文件。

加载整个代码库需要一点时间。你绝对不想在尝试缩小每一行时，对吧？想象一下，你加载一条线，缩小它，加载另一条线，缩小它等等 - 这将是一团糟。你无法进​​行流式处理（你需要一个完整的桶代码，然后才可以使用它）。为了正确地使用这个文件，你需要首先加载所有代码，然后再尝试修改它。

由于Gulp是一个流式构建系统，除非有一些机制将流转换为缓冲区，否则不能使用uglify（&完成时）您提到的两种工具都可以实现这一点。

以下是流程：
STREAM>（BUFFER）> {完成一些工作你可以使用.pipe（），因为乙烯基缓冲区/ gulp-streamify帮助文件将数据流转换为缓冲区，然后缓冲到数据流。他们是不同的方法来完成基本相同的事情。

As the documentation says, they both deal with transforming non-stream plugins to stream.

What I try to understand is, if I can use the .pipe() method on something, doesn't it mean it's a stream?

If so, what do I convert to what here?

vinyl-source-stream example:

(from: https://www.npmjs.com/package/vinyl-buffer)

var browserify = require('browserify')
var source = require('vinyl-source-stream')
var buffer = require('vinyl-buffer')
var uglify = require('gulp-uglify')
var size = require('gulp-size')
var gulp = require('gulp')

gulp.task('build', function() {
  var bundler = browserify('./index.js')

  return bundler.pipe()
    .pipe(source('index.js'))
    .pipe(buffer()) // <---------------------- why?
    .pipe(uglify())
    .pipe(size())
    .pipe(gulp.dest('dist/'))
})

gulp-streamify example:

(from: https://www.npmjs.com/package/vinyl-source-stream)

var source = require('vinyl-source-stream')
var streamify = require('gulp-streamify')
var browserify = require('browserify')
var uglify = require('gulp-uglify')
var gulp = require('gulp')

gulp.task('browserify', function() {
  var bundleStream = browserify('index.js').bundle()

  bundleStream
    .pipe(source('index.js'))
    .pipe(streamify(uglify())) // <----------- why?
    .pipe(gulp.dest('./bundle.js'))
})

解决方案

One semi-useful example is to think about putting out a campfire with a bucket of water. To put out the fire you would want to completely fill up the bucket before dumping it on the fire rather putting a few drops in the bucket and then dumping lots of little drops over time on the fire. This metaphor doesn't capture everything but the big idea is this: you need a FULL bucket of water before you can put out the fire.

That "uglify" plugin works the same way. Imagine some enormous JS file you'd want to compress/uglify.

It will take a little bit of time to load the whole codebase & you definitely wouldn't want to try minifying each line as it comes in, right? Imagine you load a single line, minify it, load another line, minify it, etc etc-- it'd be a mess. You can't stream it (you need a full "bucket" of code before you can uglify it.) To uglify that file properly you'd need to load all that code first before attempting to uglify it.

Since Gulp is a "streaming" build system, you can't use uglify unless you have some mechanism to turn the stream into a buffer (& when it's done emit a stream.) Both tools you mention make this possible.

Here's the flow: STREAM > (BUFFER) > {perform some work on the whole "buffered" file} > STREAM > {other gulp work, etc }

To your specific question, you can use .pipe() because vinyl-buffer/gulp-streamify help "convert" streams to buffers then buffers to streams. They're different approaches to accomplish essentially the same thing.

这篇关于乙烯缓冲剂和吞咽吞咽的目的是什么？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！