Metro bundler: Error: EISDIR: illegal operation on a directory, read - react-native

Question

When I reload my bundle this exception is uncaught:
Error: EISDIR: illegal operation on a directory, read
at Object.readSync (fs.js:592:3)
at tryReadSync (fs.js:366:20)
at Object.readFileSync (fs.js:403:19)
at UnableToResolveError.buildCodeFrameMessage (/home/brady/obs-websocket-app/node_modules/metro/src/node-haste/DependencyGraph/ModuleResolution.js:347:17)
at new UnableToResolveError (/home/brady/obs-websocket-app/node_modules/metro/src/node-haste/DependencyGraph/ModuleResolution.js:333:35)
at ModuleResolver.resolveDependency (/home/brady/obs-websocket-app/node_modules/metro/src/node-haste/DependencyGraph/ModuleResolution.js:211:15)
at DependencyGraph.resolveDependency (/home/brady/obs-websocket-app/node_modules/metro/src/node-haste/DependencyGraph.js:413:43)
at /home/brady/obs-websocket-app/node_modules/metro/src/lib/transformHelpers.js:317:42
at /home/brady/obs-websocket-app/node_modules/metro/src/Server.js:1471:14
at Generator.next (<anonymous>)
My package.json
{
"main": "src/index.js",
"scripts": {
"android": "react-native run-android",
"ios": "react-native run-ios",
"web": "expo start --web",
"start": "react-native start",
"test": "jest"
},
"dependencies": {
"#types/node": "^14.14.35",
"events": "^3.3.0",
"expo": "~40.0.0",
"expo-splash-screen": "~0.8.0",
"expo-updates": "~0.4.0",
"obs-websocket-js": "^4.0.2",
"react": "16.13.1",
"react-dom": "16.13.1",
"react-native": "~0.64.0",
"react-native-elements": "^3.3.2",
"react-native-gesture-handler": "~1.8.0",
"react-native-reanimated": "~1.13.0",
"react-native-screens": "~2.15.0",
"react-native-unimodules": "~0.12.0",
"react-native-web": "~0.13.12"
},
"devDependencies": {
"#babel/core": "~7.9.0",
"#types/react": "~16.9.35",
"#types/react-dom": "~16.9.8",
"#types/react-native": "~0.63.2",
"babel-preset-expo": "~8.3.0",
"jest-expo": "~40.0.0",
"typescript": "~4.0.0"
},
"jest": {
"preset": "react-native"
},
"private": true
}

Answer 1

Replace this code in `MainApplication.java
#Override
protected String getJSMainModuleName() {
return "src/index"; <---add this
}

Answer 2

For IOS
// packages/myapp/ios/myapp/AppDelegate.m:56
return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:#"src/index" fallbackResource:nil];

Answer 3

Apparently there's an issue with moving index.js to src/index.js. I moved it back to the project root and it's working fine now.

Answer 4

Solved by deleting and creating new android emulator...

Answer 5

I got same error, but all going well after I yarn global remove wml
yarn global remove wml
that save my life
if you have never install wml, just consider some other related global libs
----update-----
I got the error again even I uninstall wml staff, but I found my issue's root cause was the watchman, after run brew uninstall watchman, all going well

Answer 6

An old instance of the remote debugger running caused this for me. Not sure of the "whys", but if you want to kill the debugger programmatically, add this to the top of your App.tsx or whatever your top-level entry file is:
import { NativeModules } from 'react-native';
NativeModules.DevSettings.setIsDebuggingRemotely(false);
Credit to Christophe Marois over at this answer How to disable Remote JS Debugging in React-Native

Answer 7

If you are using create-react-native-library for native modules and getting this error. Do the following:
cd example
npx react-native start
In rootDir, yarn example run