Gulp 處理文件

Gulp 暴露了 src()dest() 方法,用於處理計算機上存放的文件。gulp

其中 src() 方法接受一個 glob 參數,從文件系統中讀取文件,而後生成一個 Node 流。它將全部匹配的文件讀取到內存中並經過流進行處理。babel

src() 方法產生的流應當從任務中返回併發出異步完成的信號,就如 建立任務文檔中所述。併發

示例:
const { src, dest } = require('gulp');

exports.default = function() {
  return src('src/*.js')
    .pipe(dest('output/'));
}

流提供的主要的 API 是用於連接轉換或者是可寫流的 .pipe() 方法。異步

const { src, dest } = require('gulp');
const babel = require('gulp-babel');

exports.default = function() {
  return src('src/*.js')
    .pipe(babel())
    .pipe(dest('output/'));
}

dest() 接受一個輸出目錄做爲參數,而且它還會產生一個 Node 流,一般做爲終止流。當它接收經過管道傳遞的文件時,它將文件內容和其餘細節寫入給定目錄中。gulp 還提供了 symlink() 方法,它的操做方式與dest() 相似,但會建立連接而不是文件。ui

大多數狀況下,插件將使用.pipe() 方法放置在 src()dest() 之間,並將轉換流中的文件。插件

向流中添加文件

src() 方法能夠放在管道的中間,根據給定的 glob 向流中添加文件,新加入的文件只會對後續的轉換可用,若是 glob 匹配的文件與以前的有重複,它仍然會再次添加文件。code

示例:
const { src, dest } = require('gulp');
const babel = require('gulp-babel');
const uglify = require('gulp-uglify');

exports.default = function() {
  return src('src/*.js')
    .pipe(babel())
    .pipe(src('vendor/*.js'))
    .pipe(uglify())
    .pipe(dest('output/'));
}

分階段輸出

dest() 方法能夠用在管道中間用於將文件的中間狀態寫入文件系統,當接收到一個文件時,當前狀態的文件將會被寫入文件系統,文件路徑也將會被修改從而來反映出輸出文件的新位置,而後該文件繼續沿着管道傳輸。ip

示例:
const { src, dest } = require('gulp');
const babel = require('gulp-babel');
const uglify = require('gulp-uglify');
const rename = require('gulp-rename');

exports.default = function() {
  return src('src/*.js')
    .pipe(babel())
    .pipe(src('vendor/*.js'))
    .pipe(dest('output/'))
    .pipe(uglify())
    .pipe(rename({ extname: '.min.js' }))
    .pipe(dest('output/'));
}

三種文件模式

  • 緩衝(buffered)模式:默認模式,將文件內容加載到內存中。插件一般運行在緩衝模式下且許多插件不支持流動模式。
  • 流(streaming)模式:主要用於操做沒法存放內存中的大文件,文件內容從文件系統中以小塊的方式流式傳輸而不是一次性所有加載。
  • 空模式(empty):不包含任何內容,只在文件處理元數據時有效。

上面三種模式均可以經過對 src() 方法的 bufferread 參數進行設置。內存

相關文章
相關標籤/搜索