Mac 環境 Vue 開發 CPU 占用率高 問題

Mac開發Vue應用時，發現CPU風扇轉的老高。

htop查看一下：

問題找到了，就是這個dev-server.js，node起的進程。

然后就是 dtruss -p 1230(進程ID) 命名跟蹤一下這個進程，發現一直在讀取應用下的每個js文件。

ps aux | grep node | grep -v grep | awk '{print $2}' | xargs sudo dtruss -p

 

然后借用同事的ubuntu系統，問題並沒有出現。這讓我一度很沮喪。

然后聯想到是不是熱更新出的問題，然后就是跟蹤webpack源碼，當然也是一無所獲。

 

后面不知咋地，使用如下命令 竟然修復了CPU占有率高的問題：

npm install

> fsevents@1.1.2 install /Users/phpdragon/SourceCode/phpdragon.com/front/node_modules/fsevents
> node install

[fsevents] Success: "/Users/phpdragon/SourceCode/phpdragon.com/front/node_modules/fsevents/lib/binding/Release/node-v57-darwin-x64/fse.node" already installed
Pass --update-binary to reinstall or --build-from-source to recompile
npm notice created a lockfile as package-lock.json. You should commit this file.
added 115 packages in 5.919s

 

用git工具對比了一下，發現多增加了如下文件：

 

再重啟應用

npm run dev

htop一下：

 

現在世界終於清靜了！

 

 

同樣的命令在window下執行：

$ npm install
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.0.0 (node_modules\chokidar\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.1.2: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})

報當前系統不支持，類庫只支持MacOS。

 

總結：

原因就是webpack的熱更新用到了fsevent 類庫，所以當找不到的時候，程序不會報錯，但會不停掃描項目下的所有js文件。導致CPU使用率很高。

具體原因還得深入到webpack的源碼進行查看了。

 

有句話說的好，喜歡就買、不喜就分、多喝熱水、重啟試試！

所以你沒事就 npm install 試試，說不定就好了！霧

 

PS：  

Webpack-源碼 

Native Access to Mac OS-X FSEvents

FSevents on Wiki

Linux和Mac OS X 中監視文件變化