A plugin that grab images url in CSS files, minify those images, and replace image urls to the minified ones stored in your local disk. It supports both local and remote images grabbing and it can minify .png, .jpg, .jpeg, .gif image files.
This plugin requires Grunt
If you haven't used Grunt before, be sure to check out the Getting Started guide, as it explains how to create a Gruntfile as well as install and use Grunt plugins. Once you're familiar with that process, you may install this plugin with this command:
npm install grunt-cssimage --save-dev
In your project's Gruntfile, add a section named
cssimage to the data object passed into
A number value that represents optimization level 1-7. 7 is the maximum optimization level.
A string value that refers to the path which would store the minified images in your local computer.
A boolean value that is used to tell grunt to whether empty you imagePath or not before executing the task.
A boolean value that is used to decide to whether save the original(un-minified) images in imagePath or not.
In this example, the default options are used. So it will first empty the
./image path. If the
src/test.css file has some image urls inside, the task will grab the images locally or remotely, minify them, and then replace those urls with minified ones stored in your local computer. The output replaced file will be
dest/test.css. At last,
./image/original directory will be emptied.
In this example, images grabbing, minification and replacement are the same to the default options example. But the image path will change to
./tmp. Also, grunt will not empty the image path before task execution and save both original and minified images in the end.