gulp 集成其餘基於流的工具

1. 流、緩衝、vinyl 文件對象

gulp 的流是虛擬文件對象
包含的屬性有

    base 文件名  
    path 文件路徑
    content  緩衝、nodejs 流

2. gulp 集成 browserify

browserify 基於文本流，缺乏的是base 以及path,可使用的工具 vinyl-source-stream 

var source = require('vinyl-source-stream')
var streamify = require('gulp-streamify')
var browserify = require('browserify')
var uglify = require('gulp-uglify')
var gulpify = require('gulpify')
var rename = require('gulp-rename')
var gulp = require('gulp')
 
// using gulpify: 
gulp.task('gulpify', function() {
  gulp.src('index.js')
    .pipe(gulpify())
    .pipe(uglify())
    .pipe(rename('bundle.js'))
    .pipe(gulp.dest('./'))
})
 
// using vinyl-source-stream: 
gulp.task('browserify', function() {
  var bundleStream = browserify('./index.js').bundle()
  bundleStream
    .pipe(source('index.js'))
    .pipe(streamify(uglify()))
    .pipe(rename('bundle.js'))
    .pipe(gulp.dest('./'))
})

3. 轉換內容(轉換爲緩衝)

使用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())
    .pipe(uglify())
    .pipe(size())
    .pipe(gulp.dest('dist/'))
})