ag-grid is proud to partner with webpack

Watch and WatchOptions

webpack can watch files and recompile whenever they change. This page explains how to enable this and a couple of tweaks you can make if watching does not work properly for you.

boolean

Turn on watch mode. This means that after the initial build, webpack will continue to watch for changes in any of the resolved files. Watch mode is turned off by default:

watch: false

In webpack-dev-server and webpack-dev-middleware watch mode is enabled by default.

object

A set of options used to customize watch mode:

watchOptions: {
  aggregateTimeout: 300,
  poll: 1000
}

number

Add a delay before rebuilding once the first file changed. This allows webpack to aggregate any other changes made during this time period into one rebuild. Pass a value in milliseconds:

aggregateTimeout: 300 // The default

For some systems, watching many file systems can result in a lot of CPU or memory usage. It is possible to exclude a huge folder like node_modules:

ignored: /node_modules/

It is also possible to use anymatch patterns:

ignored: "files/**/*.js"

boolean number

Turn on polling by passing true, or specifying a poll interval in milliseconds:

poll: 1000 // Check for changes every second

If watching does not work for you, try out this option. Watching does not work with NFS and machines in VirtualBox.

If you are experiencing any issues, please see the following notes. There are a variety of reasons why webpack might miss a file change.

Verify that webpack is not being notified of changes by running webpack with the --progress flag. If progress shows on save but no files are outputted, it is likely a configuration issue, not a file watching issue.

webpack --watch --progress

Verify that you have enough available watchers in your system. If this value is too low, the file watcher in Webpack won't recognize the changes:

cat /proc/sys/fs/inotify/max_user_watches

Arch users, add fs.inotify.max_user_watches=524288 to /etc/sysctl.d/99-sysctl.conf and then execute sysctl --system. Ubuntu users (and possibly others), execute: echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf && sudo sysctl -p.

On MacOS, folders can get corrupted in certain scenarios. See this article.

Because webpack expects absolute paths for many config options such as __dirname + "/app/folder" the Windows \ path separator can break some functionality.

Use the correct separators. I.e. path.resolve(__dirname, "app/folder") or path.join(__dirname, "app", "folder").

On some machines Vim is preconfigured with the backupcopy option set to auto. This could potentially cause problems with the system's file watching mechanism. Switching this option to yes will make sure a copy of the file is made and the original one overwritten on save.

:set backupcopy=yes

When using the JetBrains WebStorm IDE, you may find that saving changed files does not trigger the watcher as you might expect. Try disabling the safe write option in the settings, which determines whether files are saved to a temporary location first before the originals are overwritten: uncheck File > Settings... > System Settings > Use "safe write" (save changes to a temporary file first).