Search code examples
node.jsgruntjswatchjshintnodemon

Concurrently Run `watch` & `nodemon` with Grunt


I'm just getting started with Grunt and would like to run grunt-contrib-watch [GitHub page] to lint my JavaScript every time a file is modified (with grunt-contrib-jshint [GitHub page]) and run grunt-nodemon [GitHub page] too, concurrently using grunt-concurrent [GitHub page].

As I understand (which I evidently don't) my Gruntfile should:

  1. Run concurrent by default
  2. concurrent runs watch
  3. watch runs jshint every time a file is modified

Gruntfile.js

module.exports = function (grunt) {
    grunt.initConfig({
        concurrent: {
            dev: [
                'watch'
            ],
            options: {
                logConcurrentOutput: true
            }
        },
        jshint: {
            server: [
                '**/*.js',
                '!node_modules/**/*.js'
            ],
            options: {
                node: true
            }
        },
        watch: {
            all: [
                '**/*/.js',
                '!node_modules/**/*.js'
            ],
            tasks: [
                'jshint'
            ]
        }
    });

    grunt.loadNpmTasks('grunt-concurrent');
    grunt.loadNpmTasks('grunt-contrib-jshint');
    grunt.loadNpmTasks('grunt-contrib-watch');

    grunt.registerTask('default', [
        'concurrent:dev'/*,
        'jshint',
        'watch'*/
    ]);
};

    grunt.loadNpmTasks('grunt-concurrent');
    grunt.loadNpmTasks('grunt-contrib-jshint');
    grunt.loadNpmTasks('grunt-contrib-watch');

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

N.B. I've not added grunt-nodemon into the mix yet.

It looks like concurrent is running watch but when I modify a file it appears jshint isn't running. I certainly don't get any output in the Terminal (I thought logConcurrentOutput: true does this).

Here is the output I get in the Terminal:

Running "concurrent:dev" (concurrent) task
Running "watch" task
Waiting...    


Done, without errors.

I would also like to run jshint when I first run the default task (as well as when I modify files).

Can anyone shed some light on where I am going wrong?

Thanks!


Solution

  • The watch task exits if there are no files found to 'watch'; as per this issue.

    To easily tell watch to watch the same files as the jshint task I used Grunt's templating engine to reference the same Array of files as the jshint task.

    I then added jshint to the list of concurrent tasks to run so it would be ran initially and as I modify files (with watch).

    Here is my working Gruntfile:

    module.exports = function (grunt) {
        grunt.initConfig({
            concurrent: {
                dev: [
                    'jshint',
                    'watch'
                ],
                options: {
                    logConcurrentOutput: true
                }
            },
            jshint: {
                server: [
                    '**/*.js',
                    '!node_modules/**/*.js'
                ],
                options: {
                    node: true
                }
            },
            watch: {
                files: '<%= jshint.server %>',
                tasks: [
                    'jshint'
                ]
            }
        });
    
        grunt.loadNpmTasks('grunt-concurrent');
        grunt.loadNpmTasks('grunt-contrib-jshint');
        grunt.loadNpmTasks('grunt-contrib-watch');
    
        grunt.registerTask('default', [
            'concurrent'
        ]);
    };