Gulp Optimizing Images - Gulp

What is Gulp Optimizing Images?

In this chapter, you are going to learn, how to optimize images.Through optimizing you will be able to reduce the size of the images and helps in faster loading.

Install Plugins to Optimize Images

From your command line, Go to “work” directory and install “gulp-changed” and “gulp-imagemin” plugins by using the following commands.

Declare Dependencies and Create Tasks

In your configuration file gulpfile.js, first you need to declare the dependencies as shown in the command below......

Next, you will be able to create tasks for optimizing images by observing the following code.

The imagemin task will accept jpg,png and gif images from src/images/ folder and minify them before writing it into the destination. The changed() makes sure that only the new files are passed for minifying in each time. The gulp-changed plugin will only process the new files and hence precious time is utilised.

Run the Tasks

The configuration file is set up now and ready to execute. The following command can be used to run the task.


By running the task through the above command, you will get the following as a result in the command prompt.

All rights reserved © 2020 Wisdom IT Services India Pvt. Ltd Protection Status

Gulp Topics