javascriptgruntjsbrowserifywatchify

Trigger grunt task after browserify/watchify run


I'm trying to build my JS-bundle via grunt/browserify. I also use grunt for scss compile. For that I use grunt-watch to trigger scss compile on changes.

I wanted the same behavior for JS-browserify. grunt-browserify comes with the "watch" option, which does the trick very well.

My only issue is: I want to get notified after a "re-browserify". For SCSS I use grunt-notify. But I do not find any way to trigger a grunt task after browserify-watch.

My gruntfile excerpt:

var gruntOptions = {

    notify: {
        browserify_node_modules: {
            options: {
                title: "Browserify",
                message: "node_modules build"
            }
        }
    },

    browserify: {
        node_modules: {
            src: ["node_modules.js"],
            dest: "trunk/js/lib/node_modules.js",
            options: {
                watch: true,
            }
        }
    }
};

Best case scenario:

            options: {
                watch: true,
                finishTask: "notify:browserify_node_modules"
            }

Thanks!


Solution

  • You can check if the file generated by Browserify has been changed and then, trigger a task.

    Install watch task in Grunt:

    npm install grunt-contrib-watch --save-dev
    

    Configure watch task within Gruntfile.js:

    grunt.initConfig({
    
        // other tasks
    
        your_task: {
            // ...
        },
    
        watch: {
            dev: {
                files: 'trunk/js/lib/node_modules.js', // file generated by Browserify
                options: { spawn: false },
                tasks: ['your_task']
            }
        }
    });
    
    grunt.loadNpmTasks('grunt-contrib-watch');