Gulp processes files

Gulp exposes the src() and dest() methods for processing files stored on the computer.

The src() method accepts a glob parameter, reads the file from the file system, and then generates a Node stream. It reads all matching files into memory and processes them through the stream.

The stream generated by the src() method should return from the task and signal asynchronous completion, as described in the Create Task document.

Example:

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

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

API provided by the .pipe() method for link conversion or writable stream.

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

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

dest() accepts an output directory as a parameter, and it also generates a Node stream, usually as a terminating stream. When it receives the file passed through the pipe, it writes the contents of the file and other details into the given directory. gulp also provides the symlink() method, which operates dest() , but creates a link instead of a file.

In most cases, the plugin will use the .pipe() method to be placed between src() and dest() , and will convert the files in the stream.

Add files to the stream

src() method can be placed in the middle of the glob to add files to the stream according to the given 0609f4751c69a4. The newly added files will only be available for subsequent conversions. If the glob is duplicated with the previous one, it will still add the file again.

Example:

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/'));
}

Phased output

dest() method can be used in the middle of the pipeline to write the intermediate state of the file to the file system. When a file is received, the current state of the file will be written to the file system, and the file path will also be modified to reflect the output The new location of the file, and then the file continues along the pipeline.

Example:

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/'));
}

Three file modes

• Buffered mode: The default mode is to load the contents of the file into memory. Plug-ins usually run in buffered mode and many plug-ins do not support flow mode.
• Streaming mode: It is mainly used to manipulate large files that cannot be stored in memory. The file content is streamed from the file system in small chunks instead of being loaded all at once.
• Empty mode (empty): does not contain any content, only valid when the file is processing metadata.

The above three modes can all be set by the buffer and read parameters src()