fast builds with grunt and browserify

bad.js

module.exports = function(grunt) {

  "use strict";

  grunt.initConfig({
    
    pkg : grunt.file.readJSON("package.json"),

    paths : {
      src  : "<%= pkg.main %>",
      dest : "dist/out.js"
    },


    // using watch is slow because it runs browserify from cold start
    watch: {
      options : {
        atBegin : true
      },
      browserify : {
        files : ["src/**/*.js"],
        tasks : ["browserify:dev"] // no incremental builds :(
      }
    },

    browserify : {
      dev : {
        src : ["<%= paths.src %>"],
        dest : "<%= paths.dest %>",
        options : {
          browserifyOptions : {
            debug : true
          }
        }
      }
    }

  });

  grunt.loadNpmTasks("grunt-contrib-watch");
  grunt.loadNpmTasks("grunt-browserify");

  grunt.registerTask("default", ["watch"]);
  
};

good.js

module.exports = function(grunt) {

  "use strict";

  grunt.initConfig({

    pkg : grunt.file.readJSON("package.json"),

    paths : {
      src  : "<%= pkg.main %>",
      dest : "dist/out.js"
    },

    browserify : {
      dev : {
        src : ["<%= paths.src %>"],
        dest : "<%= paths.dest %>",
        options : {
          watch : true, // use watchify for incremental builds!
          keepAlive : true, // watchify will exit unless task is kept alive
          browserifyOptions : {
            debug : true // source mapping
          }
        }
      },
      dist : {
        src : ["<%= paths.src %>"],
        dest : "<%= paths.dest %>"
      }
    }

  });

  grunt.loadNpmTasks("grunt-browserify");

  grunt.registerTask("dev", ["browserify:dev"]);
  grunt.registerTask("dist", ["browserify:dist"]);
  grunt.registerTask("default", ["dev"]);

};

What happens if I have other tasks, like less compyling or running server ? Watchify will block them ?

@padsbanger in that case, you will need to use grunt-concurrent I believe. Any other solutions?

@padsbanger @DeeperX I've not tested this but i think it goes something like this...

If you use LESS (or anything else) and have a grunt watching for changes, you can drop the keepAlive:true option from browserify task. Instead put it before watch in your grunt task e.g.

grunt.registerTask("default", ["browserify:dev", "watch"]);

watch stops grunt exiting so it should work OK

Thanks @WickyNilliams, you're still helping ppl on 2020!

@wggley haha crazy. Glad to be of help!