Grunt Watch Task Not Triggering Uglify Task

Question

I'm running a pretty straightforward workflow with Grunt, operating inside MAMP. I'm using a watch task to trigger a Sass task, which runs two sub-tasks (placing expanded and compressed stylesheets in different directories), and minifying/concatenating JavaScript files. The Sass task works without issue, but the Watch task will not see any JavaScript file changes to trigger the Uglify task. Here's my Grunt.js file

module.exports = function(grunt){
    grunt.initConfig({
        pkg : grunt.file.readJSON('package.json'),

        //Sass task
        sass:{
            dev: {
                options: {
                    style: 'expanded',
                    sourcemap: 'none'
                },
                files: {
                    //Destination, Source
                    'human-readable/style-expanded.css': 'sass/style.scss',
                    'human-readable/bootstrap-min.css': 'sass/bootstrap.scss'
                }
            },
            prod:{
                options:{
                    style: 'compressed',
                    sourcemap: 'none'
                },
                files:{
                    //Destination, Source
                    'style.css': 'sass/style.scss',
                    'css/bootstrap.min.css': 'sass/bootstrap.scss'
                }
            }
        },

        //Uglify task
        uglify:{
            options:{
                mangle: false,
                screwIE8: true
            },
            my_target:{
                files:{
                    //Destination, Source
                    'js/main.min.js': ['human-readable/main.js','js/bootstrap.min.js']
                }
            }
        },

        //Watch task
        watch: {
            css: {
                files: '**/*.scss',
                tasks: ['sass']
            },
            scripts: {
                files: '**/*.js',
                tasks: ['uglify']
            }
        }
    });

    grunt.loadNpmTasks('grunt-contrib-sass');
    grunt.loadNpmTasks('grunt-contrib-uglify');
    grunt.loadNpmTasks('grunt-contrib-watch');
    grunt.registerTask('default', ['watch']);

}

Ideas?

Answer 1

may be you are trying to watch two things at the same time, that might be the problem, try the grunt-concurrent module, it allows you to run grunt tasks concurrently / in parallel:

grunt.loadNpmTasks('grunt-concurrent');
grunt.initConfig({
    ...
    concurrent: {
        tasks: ['watch:css', 'watch:script']
    }
    ...

grunt.registerTask('default', ['concurrent']);
...