Sample Gruntfile.js for GWG-MWS (Grow with Google Mobile Web Specialist)

Gruntfile.js

  module.exports = function(grunt) {

  // Project configuration.
  grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),
    responsive_images:{
      myTask:{
      options:{}, /* left blank to keep it simple */
      files:[{
        expand:true,
        src: ['img/*.jpg'], /* source folder - do not change src, just change the directory name in this case img */
        dest:'dest', /* dest the key is hardcoded as dest, and dest the value is the actual directory name of the destination folder. This will be created on the fly if it does not already exist */
      }]
    }
  },
  clean : {
    path : {
        src : [ "dest/img/*.jpg"] /* /* ignore if you don't need, this is just added to delete files easily */
    }
}
  })

  // Load the plugin
  grunt.loadNpmTasks('grunt-responsive-images');
  grunt.loadNpmTasks('grunt-contrib-clean'); /* ignore if you don't need, this is just added to delete files easily */

  // Default task(s).
  grunt.registerTask('default', ['responsive_images']); /* note this is the KEY responsive_images in line 6 */
  grunt.registerTask('clean_images', ['clean']); /* ignore if you don't need, this is just added to delete files easily */

};


/* Refer to this article to get the set up 
https://addyosmani.com/blog/generate-multi-resolution-images-for-srcset-with-grunt/

And type grunt at command prompt to run grunt-responsive-images (it is now the default). Type grunt clean_images to run clean_images 
*/