How to understand Grunt task options

Question

My goal is to run ES6 code on browser, and after reading a lot, I found this enter link description here

and is able to run ES2015 code. But I am having a difficult time to create a Gruntfile.js, I don't understand what keywords are available and what they do. Take browserify for example, it could configurate like this

module.exports = function (grunt) {
   grunt.initConfig({
      browserify: {
         dist: {
            options: {
               transform: [
                  ["babelify", {
                     "presets":["es2015"]
                  }]
               ]
            },
            files: {               
               "./dist/module.js": ["./modules/index.js"]
            }
         }
      },

   });

   grunt.loadNpmTasks("grunt-browserify"); 
   grunt.registerTask("default", ["browserify"]);
};

Then I go to browserify website to read documentation. There is presets , but no transform . How do I know that I should nest dist>options>transform, and have a presets in it? and do I able to use loose: "all" ? Same question when I try to understand grunt, why does people use dist , is it for cli (run grunt --target=dist)?

Sorry if I sound stupid, having hard time understanding grunt options for days.

Answer 1

It's just a naming conventions for folders like in java we have

• dist is the folder where your generated archives are stored (so it gets updated through clean and build).
• build folder contains compiled classes and resources, but not the compressed archives.