Bmaed Riasbet
Bmaed Riasbet

Reputation: 15028

React Native Error: ENOSPC: System limit for number of file watchers reached

I have setup a new blank react native app.

After installing few node modules I got this error.

Running application on PGN518.
internal/fs/watchers.js:173
   throw error;
   ^

Error: ENOSPC: System limit for number of file watchers reached, watch '/home/badis/Desktop/react-native/albums/node_modules/.staging'
   at FSWatcher.start (internal/fs/watchers.js:165:26)
   at Object.watch (fs.js:1253:11)
   at NodeWatcher.watchdir (/home/badis/Desktop/react-native/albums/node modules/sane/src/node watcher. js:175:20)
   at NodeWatcher.<anonymous> (/home/badis/Desktop/react-native/albums/node modules/sane/src/node watcher. js:310:16)
   at /home/badis/Desktop/react-native/albums/node modules/graceful-fs/polyfills.js:285:20
   at FSReqWrap.oncomplete (fs.js:154:5)

I know it's related to no enough space for watchman to watch for all file changes.

I want to know what's the best course of action to take here ?

Should I ignore node_modules folder by adding it to .watchmanconfig ?

Upvotes: 640

Views: 617301

Answers (30)

It happens because your system is watching many files and this results in a lot of CPU or memory usage. It is possible to exclude a huge folder like node_modules using a regular expression:

Just at the root of your folder, create a webpack.config.js, and add the following:

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

Upvotes: 0

Ali Asghar Gill
Ali Asghar Gill

Reputation: 31

To fix the ENOSPC: System limit for number of file watchers reached error in Linux, you need to increase the number of available file watchers. Follow these steps:


RUN THE FOLLOWING COMMANDS IN TERMINAL


  1. Check the current limit:

    cat /proc/sys/fs/inotify/max_user_watches
    
  2. Increase the limit (e.g., to 524288):

    echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf && sudo sysctl -p
    
  3. Verify the new limit:

    cat /proc/sys/fs/inotify/max_user_watches
    
  4. Restart your development environment.

This should resolve the error and allow the app to run properly.

Upvotes: 0

Akaisteph7
Akaisteph7

Reputation: 6525

What worked for me ended up being a combination of various items:

  1. Added this to my webpack config file: watchOptions: { ignored: **/node_modules/ }
  2. Cleared out my existing node_modules folder: sudo rm -rf node_modules
    • This error happens from inotify watchers getting completely used up and deleting node_modules causes React to create a fresh inotify instance, with no watchers on it.

Upvotes: 0

Abdulla Thanseeh
Abdulla Thanseeh

Reputation: 10566

Linux uses the inotify package to observe filesystem events, individual files or directories.

Since React / Angular hot-reloads and recompiles files on save it needs to keep track of all project's files. Increasing the inotify watch limit should hide the warning messages.

You could try editing

# insert the new value into the system config
echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf && sudo sysctl -p

# check that the new value was applied
cat /proc/sys/fs/inotify/max_user_watches

# config variable name (not runnable)
fs.inotify.max_user_watches=524288

Real problem

However, adding more watches is putting the cart in front of the horse. To learn more about the real solution.

Read this answer: https://stackoverflow.com/a/70436159/6513173

Or read the WebPack docs: https://webpack.js.org/configuration/watch/#watchoptionsignored

Upvotes: 936

ANTONIO ROLLANDE YVES
ANTONIO ROLLANDE YVES

Reputation: 21

I solve this issue by this commande on terminal

echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf && sudo sysctl -p

Upvotes: 1

Pim van der Heijden
Pim van der Heijden

Reputation: 7980

Root cause

Most answers above talk about raising the max number of watches. They don't talk about taking away the root cause. Typically, the root cause is just a matter of having watches that aren't used, they are completely redundant! This typically happens for files in node_modules. Moreover, this situation typically consumes a lot of memory unnecessarily and some older pcs may become slow because of it.

Webpack

The answer is in the webpack 5 docs: watchOptions: { ignored: /node_modules/ }. Simply read here: https://webpack.js.org/configuration/watch/#watchoptionsignored

The docs even mention this as a "tip":

If watching does not work for you, try out this option. This may help issues with NFS and machines in VirtualBox, WSL, Containers, or Docker. In those cases, use a polling interval and ignore large folders like /node_modules/ to keep CPU usage minimal.

VS Code

VS Code or any code editor creates lots of file watches too. By default many of them are completely redundant. Read more about it here: https://code.visualstudio.com/docs/setup/linux#_visual-studio-code-is-unable-to-watch-for-file-changes-in-this-large-workspace-error-enospc

Upvotes: 49

audrynyonata
audrynyonata

Reputation: 83

In my case, the error occured when using VSCode to open a react project with heavy dependencies. I used create-react-app (CRA) for that project.

Setting fs.inotify.max_user_watches=524288 made my computer freeze. So, I tried the solution that said to add watchOptions: { ignored: /node_modules/ } in the webpack config.

Step 1: Install react-app-rewired to my project

npm install react-app-rewired --save-dev 

Step 2: Create a config-overrides.js file in the project root directory. Same level as src, package.json, and node_modules.

/* config-overrides.js */
module.exports = function override(config, env) {
  //do stuff with the webpack config...
  config.watchOptions = {
    ...config.watchOptions,
    ignored: '**/node_modules',
  };
  return config;
};

Step 3: Replace the start, build, and test commands in package.json to use react-app-rewired. No need to modify the eject script.

  "scripts": {
    "start": "react-app-rewired start",
    "build": "react-app-rewired build",
    "test": "react-app-rewired test",
    "eject": "react-scripts eject"
    ...

Step 4:

npm start

Hope this helps those who have same limitations as me.
Steps taken from: How to update webpack config for a react project created using create-react-app?.

Upvotes: 1

SefaUn
SefaUn

Reputation: 1200

Solution fix this Issue:

echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf

and run your project,

npx react-native run-android

if there is,

 fs.inotify.max_user_watches=524288` in your `/etc/sysctl.conf

run same command

echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf

and run your project,

npx react-native run-android

OR

sudo reboot

Upvotes: 0

Tony Marfo O
Tony Marfo O

Reputation: 194

Solution:

I encountered this issue on a Linuxmint distro. It appeared to have happened when there were so many folders and subfolders/files I added to the /public folder in my app. I applied this fix and it worked well...

 $  echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf 

change directory into the /etc folder:

cd /etc

then run this:

sudo systcl -p

You may have to close your terminal and

npm start

again to get it to work.

If this fails i recommend installing react-scripts globally and running your application directly with that.

$  npm i -g --save react-scripts

then instead of

npm start

run

react-scripts start

to run your application.

Upvotes: 0

suther
suther

Reputation: 13628

Easy Solution:

I found, that a previous solution worked well in my case. I removed node_modules and cleared the yarn / npm cache.

Long Tail Solution: If you want to have a long-tail solution - e.g. if you are often caught by this error - you can increase the value of allowed watchers (depending on your available memory)

To figure out the currently used amount of watchers, instead of only guessing, you can use this handy bash-script:

https://github.com/fatso83/dotfiles/blob/master/utils/scripts/inotify-consumers

I suggest to set the max_user_watches temporary to a high value:

sudo sysctl fs.inotify.max_user_watches=95524288  /run the script.

How to calculate how much you can use

Each watcher needs

  • 540 bytes (32-bit system), or
  • 1 kB (double - on 64-bit OS

So if you want to allow the use of 512MB (on 64Bit), you set something 524288 as a value.

The other way around, you can take the amount of memory you will set, and multiply it by 1024.

Example:

  512 * 1024 =   52488
 1024 * 1024 = 1048576 

It shows you the exact amount of the currently used inotify-consumers. So you might have a better idea, of how much you should increase the limit.

Upvotes: 9

afshindadashnezhad
afshindadashnezhad

Reputation: 457

Solution:

echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf && sudo sysctl -p

Run This Code In the Project Terminal After Running,

npm start

Upvotes: 3

YASH THUMAR
YASH THUMAR

Reputation: 6579

The error is thrown becauset the number of files monitored by the system has reached the limit.

Result: The command executed failed! Or a warning is shown (such as executing a react-native start VSCode)

Solution:

Modify the number of system monitoring files:

Ubuntu:

sudo gedit /etc/sysctl.conf

Add a line at the bottom:

fs.inotify.max_user_watches=524288

Then save and exit! Run:

sudo sysctl -p

to check it.

Upvotes: 653

MD SHAYON
MD SHAYON

Reputation: 8063

  1. Firstly you can run every time with root privileges

    sudo npm start
    
  2. Or you can delete node_modules folder and use

    npm install              //to install again
    
  3. or you can get permanent solution

    echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf && sudo sysctl -p
    

Upvotes: 25

Costas Bakoulias
Costas Bakoulias

Reputation: 935

I use ubuntu 20 server and i add in the file : /etc/sysctl.conf the below line

fs.inotify.max_user_watches=524288

Then save the file and run

sudo sysctl -p

After that all is works fine!

Upvotes: 12

manoj patel
manoj patel

Reputation: 1240

if you working with vs code editor any editor that error due to large number of files in projects. node_modules and build not required in it so remove in list. that all open in vs code files menu

You have to filter unnecessary folders file sidebar

  1. Goes to Code > Preferences > settings

  2. in search setting search keyword "files:exclude"

  3. Add pettern

**/node_modules

**/build

Now reopen the editor and that's it

Upvotes: 5

Anonumouz
Anonumouz

Reputation: 72

Addition to previous answers Sometimes we run multiple Projects use watchers so that, we should cancel the rest projects and run current project only

so cancel rest projects and run only your current project.

Upvotes: 0

Cels
Cels

Reputation: 1334

I had many vscode projects (windows) opened. And each project window creates multiple file watchers

So closing some projects solved the issue for me.

Upvotes: 2

Kashif
Kashif

Reputation: 1464

In react.js show me same error i fix this way hope work in react native too

echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf

sudo sysctl -p

Now you can run npm start again.

npm start

Upvotes: 14

Srinivasan.S
Srinivasan.S

Reputation: 3143

Verify simplest way, it is working fine for me.

Step 1: Stop the server

Step 2: Manually delete the 'cache' folder under '.angular' folder in workspace

Step 3: Start the server

Upvotes: 0

Jamie Hutber
Jamie Hutber

Reputation: 28106

2 fixes if you've already added: fs.inotify.max_user_watches=524288

  1. Reboot the machine, things will work again
  2. Rename the folder that is causing the issue (for me node_modules) to an arbitrary name (node_modilesa) and then rename right back. This will remove the watches that linux had put on those folders. Allowing you code as normal again.

Upvotes: 2

Manishyadav
Manishyadav

Reputation: 1736

Try this , I was facing it for very long time but at the end it is solved by this,

 echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf && sudo sysctl -p

The most important step after that is restart your system.

Upvotes: 1

dguard
dguard

Reputation: 119

Generally we don't need to increase count of filewatchers In this case we will have more watchers

We need to remove redundant watchers what became zombie

The issue is that we have many filewatchers that are filling out our memory We just need remove these filewatchers (in case of node)

killall node

Upvotes: 9

Nicolas
Nicolas

Reputation: 2744

In my case in Angular 13, I added in tsconfig.spec.json

 "exclude": [
    "node_modules/",
    ".git/"
  ]

thanks @Antimatter it gaves me the trick.

Upvotes: 3

Veverke
Veverke

Reputation: 11378

Using the sysctl -p approach after setting fs.inotify.max_user_watches did not work for me (by the way this setting was already set to a high value, likely from me trying to fix this issue a while back ago, using the commonly recommended workaround(s) above).

The best solution to the problem I found here, and below I share the performed steps in solving it - in my case the issue was spotted while running visual studio code, but solving the issue should be the same in other instances, like yours:

  1. Use this script to identify which processes are requiring the most file watchers in your session.
  2. You can then query the current max_user_watches value with sysctl fs.inotify.{max_queued_events,max_user_instances,max_user_watches} and then set it to a different value (a lower value may do it) sudo sysctl -w fs.inotify.max_user_watches=16384
  3. Or you can simply kill the process you found in (1) that consumes the most file watchers (in my case, baloo_file)
  4. The above, however, will likely need to be done again when restarting the system - the process we identified as responsible for taking much of the file watchers will (in my case - baloo_file) - will again so the same in the next boot. So to permanently fix the issue - either disable or remove this service/package. I disabled it: balooctl disable.

Now run sudo code --user-data-dir and it should open vscode with admin privileges this time. (by the way when it does not - run sudo code --user-data-dir --verbose to see what the problem is - that's how I figured out it had to do with file watchers limit).

Update:
You may configure VS code file watcher exclusion patterns as described here. This may prove to be the ultimate solution, I am just not sure you will always know beforehand which files you are NOT interested watching.

Upvotes: 7

prem
prem

Reputation: 207

I solved this issue by using sudo ie

sudo yarn start

or

sudo npm start

Use sudo to solve this issue will force the number of watchers to be increased without apply any modifications in system settings. Use sudo to solve this kind of issue is never recommended, although it's a choice that have to be made by you, hope you choose wisely.

Upvotes: 10

Danrley Pereira
Danrley Pereira

Reputation: 1366

Remembering that this question is a duplicated: see this answer at original question

A simple way that solve my problem was:

npm cache clear 

best practice today is

npm cache verify 

npm or a process controlled by it is watching too many files. Updating max_user_watches on the build node can fix it forever. For debian put the following on terminal:

echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf && sudo sysctl -p

If you want know how Increase the amount of inotify watchers only click on link.

Upvotes: 18

sandejai
sandejai

Reputation: 989

I tried increasing number as suggested but it didn't work.

I saw that when I login to my VM, it displayed "restart required"

I rebooted VM and it worked

sudo reboot

Upvotes: 0

kozlone
kozlone

Reputation: 111

While almost everyone suggests to increase a number of watchers, I couldn't agree that it is a solution. In my case I wanted to disable watcher completely, because of the tests running on CI using vui-cli plugin which starts web-pack-dev server for each test.

The problem was: when a few builds are running simultaneously they would fail because watchers limit is reached.

First things first I've tried to add the following to the vue.config.js:

module.exports = {
  devServer: {
    hot: false,
    liveReload: false
  }
}

Ref.: https://github.com/vuejs/vue-cli/issues/4368#issuecomment-515532738

And it worked locally but not on CI (apparently it stopped working locally the next day as well for some ambiguous reason).

After investigating web-pack-dev server documentation I found this: https://webpack.js.org/configuration/watch/#watch

And then this: https://github.com/vuejs/vue-cli/issues/2725#issuecomment-646777425

Long story short this what eventually solved the problem:

vue.config.js

module.exports = {
publicPath: process.env.PUBLIC_PATH,
devServer: {
    watchOptions: {
        ignored: process.env.CI ? "./": null,
  },
}

}

Vue version 2.6.14

Upvotes: 4

Antimatter
Antimatter

Reputation: 157

Another simple and good solution is just to add this to jest configuration:

watchPathIgnorePatterns: ["<rootDir>/node_modules/", "<rootDir>/.git/"]

This ignores the specified directories to reduce the files being scanned

Upvotes: 6

Related Questions