Laravel Mix Watch running really slow or high CPU usage? Here's a probable fix

Ever experienced Laravel Mix/Webpack running a little sluggish in npm run watch?

Mike Griffiths

If so, you might have checked your task manager/activity monitor and seen an excessive amount of CPU being used. The problem is when you've got a lot of dependencies inside node_modules which are also being watched. It's quite easy to have a few hundred folders in node_modules each with dozens of files in, leading to thousands, or tens of thousands of files being watch.

The quick fix? Tell Laravel Mix/Webpack to ignore the node_modules folder from being watched.

In Laravel Mix:

watchOptions: {
    ignored: /node_modules/
}

If you're running vanilla Webpack when you'll need to go with something along the lines of:

module.exports = {
  //...
  watchOptions: {
    ignored: /node_modules/
  }
};

You can also pass an array of directories to ignore. Particularly useful if you're on a large project with a lot of media.

More available on that in the Webpack docs.

Don't forget though, you'll need to re-run npm run watch after you've edited your Webpack/Mix config, and if you update or install any new node modules.