You may or may not be new to Grunt, and as you become more comfortable using it you’ll most likely desire diving into other aspects of the tool chain in order to expand upon tasks like code linting, pre-processor compiling and especially image optimization which is the task we’ll be discussing today.
To install grunt-contrib-imagemin run the following command from the terminal within your project’s root directory.
npm install grunt-contrib-imagemin --save-dev
Now that we have our task in place we can now harness the functionality of this plugin and include it into our workflow. For you Codekit users out there you may or may not be aware that as of this writing Codekit bloats image file sizes randomly when optimizing .jpg or .png files.
As you can see from the output above we not only get to optimize .png files, but we also get to optimize our .jpg files at the same time! If you wanna run this task on just your .png or .jpg files you can customize your grunt.registerTask like so…
With the above tasks registered we can now execute the tasks we’ve defined above from our Terminal like so…