grunt-contrib-watch

What is grunt-contrib-watch?

grunt-contrib-watch is a Grunt plugin that watches files and directories for changes. When changes are detected, it can run predefined tasks, making it useful for automating workflows such as compiling code, running tests, or refreshing a browser.

What are grunt-contrib-watch's main functionalities?

Watch Files for Changes

This feature allows you to watch JavaScript files for changes and run the 'jshint' task whenever a change is detected. The 'spawn' option is set to false to improve performance.

{
  "watch": {
    "scripts": {
      "files": ["**/*.js"],
      "tasks": ["jshint"],
      "options": {
        "spawn": false
      }
    }
  }
}

Live Reload

This feature enables live reloading of the browser when files change. The 'livereload' option is set to true, which will trigger a browser refresh whenever a watched file changes.

{
  "watch": {
    "options": {
      "livereload": true
    },
    "scripts": {
      "files": ["**/*.js"],
      "tasks": ["jshint"]
    }
  }
}

Custom Event Handling

This feature allows you to specify custom events to watch for, such as 'added' or 'deleted'. In this example, the 'jshint' task will run only when JavaScript files are added or deleted.

{
  "watch": {
    "scripts": {
      "files": ["**/*.js"],
      "tasks": ["jshint"],
      "options": {
        "event": ["added", "deleted"]
      }
    }
  }
}

Other packages similar to grunt-contrib-watch

gulp-watch

gulp-watch is a Gulp plugin that provides file watching capabilities similar to grunt-contrib-watch. It allows you to watch files and directories for changes and run Gulp tasks in response. Compared to grunt-contrib-watch, gulp-watch is designed to work within the Gulp ecosystem, which is known for its simplicity and stream-based approach.

chokidar

chokidar is a highly efficient and flexible file watcher library for Node.js. It provides a rich API for watching files and directories, and it can be used independently or integrated into other build tools. Compared to grunt-contrib-watch, chokidar offers more advanced features and better performance, making it suitable for large projects with complex file-watching needs.

nodemon

nodemon is a utility that monitors for changes in your source and automatically restarts your Node.js application. While it is primarily used for restarting server applications, it can also be configured to watch for changes in other types of files. Compared to grunt-contrib-watch, nodemon is more focused on server-side development and provides automatic restarts rather than running arbitrary tasks.

README

grunt-contrib-watch

Run predefined tasks whenever watched file patterns are added, changed or deleted.

Getting Started

This plugin requires Grunt ~0.4.0

If you haven't used Grunt before, be sure to check out the Getting Started guide, as it explains how to create a Gruntfile as well as install and use Grunt plugins. Once you're familiar with that process, you may install this plugin with this command:

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

One the plugin has been installed, it may be enabled inside your Gruntfile with this line of JavaScript:

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

Watch task

Run this task with the grunt watch command.

Settings

There are a number of options available. Please review the minimatch options here. As well as some additional options as follows:

files

Type: String|Array

This defines what file patterns this task will watch. Can be a string or an array of files and/or minimatch patterns.

tasks

Type: String|Array

This defines which tasks to run when a watched file event occurs.

options.interrupt

Type: boolean Default: false

As files are modified this watch task will spawn tasks in child processes. The default behavior will only spawn a new child process per target when the previous process has finished. Set the interrupt option to true to terminate the previous process and spawn a new one upon later changes.

Example:

watch: {
  scripts: {
    files: '**/*.js',
    tasks: ['jshint'],
    options: {
      interrupt: true
    }
  }
}

options.debounceDelay

Type: Integer Default: 500

How long to wait before emitting events in succession for the same filepath and status. For example if your Gruntfile.js file was changed, a changed event will only fire again after the given milliseconds.

Example:

watch: {
  scripts: {
    files: '**/*.js',
    tasks: ['jshint'],
    options: {
      debounceDelay: 250
    }
  }
}

options.interval

Type: Integer Default: 100

The interval is passed to fs.watchFile. Since interval is only used by fs.watchFile and this watcher also uses fs.watch; it is recommended to ignore this option. Default is 100ms.

Examples

// Simple config to run jshint any time a file is added, changed or deleted
grunt.initConfig({
  watch: {
    files: '**/*',
    tasks: ['jshint']
  }
});

// Advanced config. Run specific tasks when specific files are added, changed or deleted.
grunt.initConfig({
  watch: {
    gruntfile: {
      files: 'Gruntfile.js',
      tasks: ['jshint:gruntfile'],
      options: {
        nocase: true
      }
    },
    src: {
      files: ['lib/*.js', 'css/**/*.scss', '!lib/dontwatch.js'],
      tasks: ['default']
    },
    test: {
      files: '<%= jshint.test.src %>',
      tasks: ['jshint:test', 'qunit']
    }
  }
});

FAQs

How do I fix the error EMFILE: Too many opened files.?

This is because of your system's max opened file limit. For OSX the default is very low (256). Temporarily increase your limit with ulimit -n 10480, the number being the new max limit.

Can I use this with Grunt v0.3?

Yes. Although grunt-contrib-watch is a replacement watch task for Grunt v0.4, version grunt-contrib-watch@0.1.x is compatible with Grunt v0.3. grunt-contrib-watch >= 0.2.x is *only compatible and recommended to use with Grunt v0.4.

Why is the watch devouring all my memory?

Likely because of an enthusiastic pattern trying to watch thousands of files. Such as '**/*.js' but forgetting to exclude the node_modules folder with '!node_modules/**/*.js'. Try grouping your files within a subfolder or be more explicit with your file matching pattern.

Release History

• 2013-02-14   v0.2.0   First official release for Grunt 0.4.0.
• 2013-01-17   v0.2.0rc7   Updating grunt/gruntplugin dependencies to rc6. Changing in-development grunt/gruntplugin dependency versions from tilde version ranges to specific versions.
• 2013-01-08   v0.2.0rc5   Updating to work with grunt v0.4.0rc5.
• 2012-12-14   v0.2.0a   Conversion to grunt v0.4 conventions. Remove node v0.6 and grunt v0.3 support. Allow watch task to be renamed. Use grunt.util.spawn "grunt" option. Updated to gaze@0.3.0, forceWatchMethod option removed.
• 2012-10-31   v0.1.4   Prevent watch from spawning duplicate watch tasks
• 2012-10-27   v0.1.3   Better method to spawn the grunt bin Bump gaze to v0.2.0. Better handles some events and new option forceWatchMethod Only support Node.js >= v0.8
• 2012-10-16   v0.1.2   Only spawn a process per task one at a time Add interrupt option to cancel previous spawned process Grunt v0.3 compatibility changes
• 2012-10-15   v0.1.1   Fallback to global grunt bin if local doesnt exist. Fatal if bin cannot be found Update to gaze 0.1.6
• 2012-10-07   v0.1.0   Release watch task Remove spawn from helper Run on Grunt v0.4

---

Task submitted by Kyle Robinson Young

This file was generated on Mon Feb 18 2013 09:00:52.