High CPU usage from Node.js when running vue-cli-service serve

Question

The CPU usage by Node goes well over 100% when I run my npm script, which is using vue-cli-service serve. How can I debug this issue?

I'm working on a Mac, Node installed through nvm. Node version: 10.16, npm version: 6.9

Morelock

Answer 1

The problem was caused by the polling option.

Removing poll: true from the watchOptions in the webpack config - fixed the problem for me.

Morelock

Removing it from where? – Lightner

From watchOptions in my webpack configuration. See webpack.js.org/configuration/watch/#watchoptions – Morelock

In my case on Win10 - in file vue.config.js it was in devServer -> watchOptions -> poll: true. Setting it to false removed cpu eating (while watching files works). – Note

Answer 2

Installing the fsevents module on MacOSX will help reduce the CPU usage.

npm install fsevents -g

npm rebuild fsevents

Emalee

This worked for me with this problem, but could you explain why? Happy to upvote with a bit of context! – Walls

@Walls Webpack suffers for high CPU usage if fsevents is not utilized. See this github issue. github.com/webpack/webpack/issues/701 – Emalee

At first this didn't work for me, due to an error in building node-gyp as I don't have XCode. After installing the Xcode Command Line Tools via xcode-select --install which was quick, fsevents installed and the high CPU usage dropped immediately. – Lightner

had to run npm rebuild fsevents after migrating to an M1 machine. – Gymnasiarch

Answer 3

i use linux in virtualbox for dev purpose, and i have shared folder from windows host to linux guest. and my my vue project is stored in my hdd and shared with vbox.

so that i have to used {devServer: watchOptions: {poll: true}} in my vue.config.js for hot reload to works. this was causing the high cpu usage problem.

so i put my code in guest hdd and set poll:false and problem has gone.

hope someone find this helpfull.

Lapp