In Gulp.js,
gulp.src() and
gulp.dest() are methods used to handle file input and output within tasks. They are essential for defining the source files to process and specifying the destination for the processed files.
gulp.src()
Purpose : gulp.src() is used to define the source files or file patterns that need to be processed by Gulp.
Usage :
gulp.src('source/*.js')
Parameters : It takes a file path, file pattern, or an array of file paths/patterns as an argument.
Functionality : This method generates a stream of vinyl file objects that represent the source files. These files are then piped (passed) to subsequent Gulp tasks for processing.
gulp.dest()
Purpose : gulp.dest() is used to specify the destination folder where the processed files will be outputted.
Usage :
gulp.dest('dist/js')
Parameters : It takes a folder path where the processed files will be saved.
Functionality : Once the files have been processed by Gulp tasks (such as minification, concatenation, etc.), gulp.dest() receives these modified files and writes them to the specified destination directory.
Example : Let's say you have a task that minifies JavaScript files from the src folder and saves the minified files in the dist folder:
const gulp = require('gulp');
const uglify = require('gulp-uglify');
gulp.task('minify-js', function() {
return gulp.src('src/*.js') // Selecting source JS files
.pipe(uglify()) // Minifying the files
.pipe(gulp.dest('dist/js')); // Saving the minified files to the dist/js folder
});
In this example :* gulp.src('src/*.js') specifies the source folder and file pattern for JavaScript files to be processed.
* .pipe(uglify()) applies the
uglify() plugin to minify the JavaScript files.
* .pipe(gulp.dest('dist/js')) writes the minified files to the
dist/js folder.
Together,
gulp.src() and
gulp.dest() form the core of Gulp's file manipulation process, allowing you to define input files, apply transformations, and output the processed files to specified destinations within your Gulp tasks.
