React-scripts/fork-ts-checker-webpack-plugin constant high CPU usage when using material/icons

Is this a bug report?

Yes

Did you try recovering your dependencies?

Yes.

Which terms did you search for in User Guide?

fork-ts-checker-webpack-plugin and react-scripts combined with: slow stuck cpu 100% cpu pegged

Environment

npx: installed 1 in 2.147s Path must be a string. Received undefined C:\Users\Tamas\AppData\Roaming\npm\node_modules\create-react-app\index.js

Environment: OS: Windows 10 Node: 8.11.4 Yarn: Not Found npm: 5.6.0 Watchman: Not Found Xcode: N/A Android Studio: Not Found

Packages: (wanted => installed) react: ^16.8.1 => 16.8.6 react-dom: ^16.8.1 => 16.8.6 react-scripts: 2.1.8 => 2.1.8

Steps to Reproduce

1. Install @material/icons
2. import { AccessAlarm } from “@material-ui/icons”; in App.tsx
3. npm start

Expected Behavior

Once it has finished building, the cpu usage should become minimal.

Actual Behavior

One of the node processes, more specifically the fork-ts-checker-webpack-plugin, flips out and pushes the CPU non-stop (I left it there overnight and was still running high the day after)

Importing an icon in the wrong way (https://www.npmjs.com/package/@material-ui/icons) completely kills the node process.

Reproducible Demo

Demo: https://stackblitz.com/edit/react-gv75il

A more illustrative way to see this happening is by trying it out locally. Then monitor the cpu usage of the fork-ts-checker-webpack-plugin.

[johnnyreilly]

See https://github.com/Realytics/fork-ts-checker-webpack-plugin/pull/256 - we’re currently mulling what the best way forward is. But for now, setting this environment variable will resolve woes by all accounts: TSC_WATCHFILE=UseFsEventsWithFallbackDynamicPolling

[johnnyreilly]

To spread the knowledge about this issue (and the workaround) I’ve blogged it here: https://blog.johnnyreilly.com/2019/05/typescript-and-high-cpu-usage-watch.html

Hope it helps people reading this!