Grunt: Recipe Browserify (and ES6)

This recipe will guide you to setup browserify in Wok workflow.
Since browserify generates inline sourcemaps, we'll use exorcise to move them to external files.

Note: right now watch mode might not work. See this issue for details

##Installation and Requirements

Install grunt-browserify and grunt-exorcise plugin:

npm install grunt-browserify grunt-exorcise --save-dev

##Task Configuration

1. Create a browserify.js file in build/grunt-tasks and paste the following boilerplate code:

/*jshint node:true */
module.exports = {
    dev: {
        options: {

            alias: [],

            browserifyOptions: {
                //build sourcemaps
                debug: true
            },
            //delegate to watchify
            watch: true
        },
        files: [
            {
                expand: true,
                cwd: '<%= paths.src.assets %>/',
                src: '<%= paths.js %>/*.js',
                dest: '<%= paths.dist.assets %>'
            }
        ]
    },
    dist: {
        options: {
            browserifyOptions: {
                debug: false
            }
        },
        files: '<%= browserify.dev.files %>'
    }
};

2. Create a exorcise.js file in build/grunt-tasks and paste the following boilerplate code:

/*jshint node:true */
module.exports = {
    dev: {
        options: {},
        files: [
            {
                expand: true,
                cwd: '<%= paths.dist.assets %>/',
                src: '<%= paths.js %>/*.js',
                dest: '<%= paths.dist.assets %>',
                ext: '.js.map'
            }
        ]
    }
};

3. Comment or delete js sub-task in build/grunt-tasks/copy.js and build/grunt-tasks/watch.js

4. Edit build/grunt-tasks/aliases.yml. Add the development tasks to the dev list just after the copy task

dev:
  ...
  - browserify:dev
  - exorcise

Then add the production sub-task to the dist list just after the copy task

dist:
  ...
  - browserify:dist

5. Enjoy