How would you use Gulp to minify JavaScript and CSS files in a project?
Gulp, a task runner in Node.js, can be used to automate minification of JavaScript and CSS files. To do this, first install Gulp globally using npm (Node Package Manager), then locally in your project directory. Create a ‘gulpfile.js’ at the root of your project.
To minify JavaScript, install ‘gulp-uglify’ plugin via npm. In ‘gulpfile.js’, require gulp and gulp-uglify. Define a task named ‘minify-js’ that sources all JS files, pipes them through uglify(), and outputs minified versions into a destination folder.
For CSS minification, use ‘gulp-clean-css’ plugin. Similar to JS, define a ‘minify-css’ task that sources all CSS files, pipes them through cleanCSS(), and outputs minified versions.
Finally, create a default task that runs both ‘minify-js’ and ‘minify-css’. Run ‘gulp’ command in terminal to execute these tasks. This process reduces file sizes, improving load times and performance.
