Infinite loop when running grunt-concurrent with 'nodemon' and 'watch' tasks

608 Views Asked by At

I am attempting to use the grunt-concurrent task to run grunt-nodemon to watch my js scripts and concurrently use watchto still concat and uglify my files when they change as well.

When I run grunt on the command line I get the following infinite loop:

Running "watch" task
Waiting...
Verifying property watch.concurrent.files exists in config...ERROR >> Unable to process task.
Warning: Required config property "watch.concurrent.files" missing.

The only way to stop this constant barrage of messages is to quit out of the command line.

Here is my gruntfile:

module.exports = function(grunt) {
  grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),
    concat: {
    dist: {
        src: [
            'public/js/libs/*.js',
        ],
        dest: 'public/js/build/production.js',
        }
    },
    uglify: {
        build: {
            src: 'public/js/build/production.js',
            dest: 'public/js/build/production.min.js'
        }
    },
    css: {
      files: ['css/*.scss'],
      tasks: ['sass'],
      options: {
          spawn: false,
      }
    },
    sass: {
    dist: {
        options: {
            style: 'compressed'
        },
        files: {
            'public/css/build/main.css': 'public/css/main.scss'
        }
      }
    },
    nodemon: {
      dev: {
        script: './start.js'
      }
    },
    watch: {
    scripts: {
        files: ['js/*.js'],
        tasks: ['concat','uglify'],
        options: {
            spawn: false,
        },
    },
    concurrent: {
        target: {
            tasks: ['nodemon', 'watch'],
            options: {
                logConcurrentOutput: true
            }
        }
    },
  }
});
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-contrib-concat');
grunt.loadNpmTasks('grunt-contrib-sass');
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.loadNpmTasks('grunt-nodemon');
grunt.loadNpmTasks('grunt-concurrent');
grunt.registerTask('default', ['concat','uglify','sass','watch','nodemon','concurrent:target']);
};

Here is my package.json:

{
  "name": "**** *****",
  "version": "1.0.0",
  "devDependencies": {
    "grunt": "~0.4.1",
    "grunt-concurrent": "^2.3.1",
    "grunt-contrib-concat": "^1.0.1",
    "grunt-contrib-imagemin": "^1.0.1",
    "grunt-contrib-sass": "^1.0.0",
    "grunt-contrib-uglify": "^2.3.0",
    "grunt-contrib-watch": "^1.0.0",
    "grunt-nodemon": "^0.4.2",
    "webpack-dev-server": "^2.9.7"
  },
  "description": "",
  "main": "app.js",
  "scripts": {
    "start": "nodemon ./start.js"
  },
  "author": "**** *******",
  "license": "ISC",
  "dependencies": {
    "cookie-parser": "^1.4.3",
    "dotenv": "^4.0.0",
    "express": "^4.16.2",
    "mongod": "^2.0.0",
    "mongoose": "^4.13.7",
    "nodemon": "^1.14.1",
    "normalize.css": "^6.0.0"
  }
}

EDIT: INFINITE LOOP SOLVED

I still don't think I have completely solved my issue, but I am one step closer...

I had a syntax error/omission in my watchtask:

    watch: {
    scripts: {
        files: ['js/*.js'],
        tasks: ['concat','uglify'],
        options: {
            spawn: false,
        },
    },

Should have included

watch: {
scripts: {
    files: ['js/*.js'],
    tasks: ['concat','uglify'],
    options: {
        spawn: false,
    },
},
css: {
      files: ['css/*.scss'],
      tasks: ['sass'],
      options: {
          spawn: false,
      },
    }
},

This was preventing my watch task from running correctly. I currently do NOT have the infinite loop anymore. Instead my command line renders this:

Running "concat:dist" (concat) task

Running "uglify:build" (uglify) task
>> 1 file created 797.64 kB → 378.58 kB

Running "sass:dist" (sass) task

Running "nodemon:dev" (nodemon) task
[nodemon] 1.14.1
[nodemon] to restart at any time, enter `rs`
[nodemon] watching: *.*
[nodemon] starting `node ./start.js`
Express running → PORT 7777

It would appear that nodemon is running, but it doesn't say anything about my watch task at all, and when I change my SCSS file, nothing happens. I would obviously like grunt-concurrent to run BOTH my nodemon and watch tasks at the same time.

Should the command line be saying something different if it has executed successfully without any errors?

Thanks!

1

There are 1 best solutions below

0
On BEST ANSWER

Removing nodemon and watch from grunt.registerTask code resolved the issue:

grunt.registerTask('default', ['concat','uglify','sass','watch','nodemon','concurrent:target']);

was running nodemon and watch as a default task and then attempting to run concurrent:target when just running concurrent:target would have run nodemon and watch concurrently anyway.

Now the terminal renders:

Running "concat:dist" (concat) task

Running "uglify:build" (uglify) task
>> 1 file created 797.64 kB → 378.58 kB

Running "sass:dist" (sass) task

Running "concurrent:target" (concurrent) task
    Running "watch" task
    Waiting...
    Running "nodemon:dev" (nodemon) task
    [nodemon] 1.14.1
    [nodemon] to restart at any time, enter `rs`
    [nodemon] watching: *.*
    [nodemon] starting `node ./start.js`
    Express running → PORT 7777

Which looks correct!

The new, corrected Gruntfile looks like this:

module.exports = function(grunt) {
  grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),
    concat: {
    dist: {
        src: [
            'public/js/libs/*.js',
        ],
        dest: 'public/js/build/production.js',
        }
    },
    uglify: {
        build: {
            src: 'public/js/build/production.js',
            dest: 'public/js/build/production.min.js'
        }
    },
    sass: {
    dist: {
        options: {
            style: 'compressed'
        },
        files: {
            'public/css/build/main.css': 'public/css/main.scss'
        }
      }
    },
    concurrent: {
        target: {
            tasks: ['nodemon', 'watch'],
            options: {
                logConcurrentOutput: true
            }
        }
    },
    watch: {
    scripts: {
        files: ['./public/js/*.js'],
        tasks: ['concat','uglify'],
        options: {
            spawn: false,
        },
    },
    css: {
          files: ['./public/css/*.scss'],
          tasks: ['sass'],
          options: {
              spawn: false,
          },
        }
    },
    nodemon: {
      dev: {
        script: './start.js'
      }
    },
});
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-contrib-concat');
grunt.loadNpmTasks('grunt-contrib-sass');
grunt.loadNpmTasks('grunt-nodemon');
grunt.loadNpmTasks('grunt-concurrent');
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.registerTask('default', ['concat','uglify','sass','concurrent:target']);

};