System limit for number of file watchers reached - create-react-app production deploy on Heroku

Question

I am using create-react-app which is continuously deployed to Heroku.The last 2 deploys failed on Heroku and it threw this error

2022-02-27T23:29:12.758222+00:00 heroku[web.1]: Process running mem=647M(125.4%)
2022-02-27T23:29:12.781765+00:00 heroku[web.1]: Error R14 (Memory quota exceeded)
2022-02-27T23:29:33.512810+00:00 heroku[web.1]: Process running mem=674M(130.3%)
2022-02-27T23:29:33.535558+00:00 heroku[web.1]: Error R14 (Memory quota exceeded)

2022-02-27T21:22:01.870428+00:00 app[web.1]: Error from chokidar (/app/src): Error: ENOSPC: System limit for number of file watchers reached, watch '/app/src/routes.ts'

2022-02-27T21:22:01.870532+00:00 app[web.1]: Error from chokidar (/app/src): Error: ENOSPC: System limit for number of file watchers reached, watch '/app/src/setupTests.ts'

...

And there are.

I haven't changed any config since it was working correctly. A few hours of research couldn't help me as there were only post about the same problem but related to npm start , which is solved by increasing max_user_watches .

Answer 1

Assuming this is purely a React application it should use virtually no memory.

Build a production release and serve it as static files. Nothing needs to happen server-side other than serving up those files. The easiest way to do that for a create-react-app application on Heroku us to use the mars/create-react-app-buildpack :

This buildpack deploys a React UI as a static web site. The Nginx web server provides optimum performance and security for the runtime.

Configure your application to use this buildpack :

heroku buildpacks:set mars/create-react-app

Then redeploy .