Cli: Unable to resolve module `./debugger-ui/ui.cc464243.js` from ``

Created on 29 Mar 2020  路  113Comments  路  Source: react-native-community/cli

Environment

System:
OS: macOS High Sierra 10.13.6
CPU: (4) x64 Intel(R) Core(TM) i5-5250U CPU @ 1.60GHz
Memory: 2.28 GB / 8.00 GB
Shell: 3.2.57 - /bin/bash
Binaries:
Node: 13.7.0 - /usr/local/bin/node
Yarn: Not Found
npm: 6.13.6 - /usr/local/bin/npm
Watchman: 4.9.0 - /usr/local/bin/watchman
SDKs:
iOS SDK:
Platforms: iOS 12.1, macOS 10.14, tvOS 12.1, watchOS 5.1
Android SDK: Not Found
IDEs:
Android Studio: Not Found
Xcode: 10.1/10B61 - /usr/bin/xcodebuild
Languages:
Python: 2.7.10 - /usr/bin/python
npmPackages:
@react-native-community/cli: Not Found
react: ^16.11.0 => 16.11.0
react-native: ^0.62.0 => 0.62.0
npmGlobalPackages:
react-native: Not Found

Description

Hi there! I'm a React Native newbie working on an interesting side project. Recently I updated project's @react-native-community/cli-debugger-ui version to 4.2.1 and had to come across below issue. Tried several workarounds, nothing worked. Reverting back @react-native-community/cli-debugger-ui version to 3.0.0 resolved the issue.

Error: Unable to resolve module ./debugger-ui/ui.cc464243.js from ``:

None of these files exist:

  • debugger-ui/ui.cc464243.js(.native|.native.js|.js|.native.json|.json|.native.ts|.ts|.native.tsx|.tsx)
  • debugger-ui/ui.cc464243.js/index(.native|.native.js|.js|.native.json|.json|.native.ts|.ts|.native.tsx|.tsx)
    at ModuleResolver.resolveDependency (__DIR__/node_modules/metro/src/node-haste/DependencyGraph/ModuleResolution.js:163:15)
    at ResolutionRequest.resolveDependency (__DIR__/node_modules/metro/src/node-haste/DependencyGraph/ResolutionRequest.js:52:18)
    at DependencyGraph.resolveDependency (__DIR__/node_modules/metro/src/node-haste/DependencyGraph.js:287:16)
    at __DIR__/node_modules/metro/src/lib/transformHelpers.js:267:42
    at Server. (__DIR__/node_modules/metro/src/Server.js:841:41)
    at Generator.next ()
    at asyncGeneratorStep (__DIR__/node_modules/metro/src/Server.js:99:24)
    at _next (__DIR__/node_modules/metro/src/Server.js:119:9)

Reproducible Demo

  • Setup a project with @react-native-community/cli-debugger-ui using version 3.0.0.
  • Build and run the application and enable debugger.
  • Update @react-native-community/cli-debugger-ui to version 4.2.1.
  • Rerun the app and above error will be displayed on Metro Bundler console.
  • Revert @react-native-community/cli-debugger-ui back to version 3.0.0.
  • Rerun the application and issue will disappear.
bug report

Most helpful comment

Solved it for me in two ways:

First I simply removed the sourceMappingURL from the mentioned files,
as these seemed to raise the error (build problems?).
But as I had to redo this on any package update / addition (which got quite annoying, as you might have guessed ; ), I was quite happy that @react-native-community/cli-debugger-ui v4.7.0 has been released yesterday!
So I quickly added the following to my package.json:

  "resolutions": {
    "@react-native-community/cli-debugger-ui": "4.7.0"
  }

Now, after deleting yarn.lock, running react-native clean-project-auto (the same could have been accomplished by deleting node_modules, cleaning the individual builds & pods, but react-native-clean-project is so much neater % ) & running yarn again, the problem was gone.
(Be sure to remove the resolution, when RN updates again...)

Hope it helps anyone!

Best,

Tim.

All 113 comments

+
Had the same problem, please help!

I followed the steps and couldn't reproduce this issue. Initializing the new [email protected] project also works. Perhaps you could provide some reproduction repo?

@Esemesek you need to have the Debug mode turned on. While remote debugger runs on web browser above error message appears on Metro Bundler console.

I will attached the both versions of package-lock.json file. You can get a diff, the change caused the issue. Let me know if you need any further details from me.

package-lock-v1.txt

package-lock-v2.txt

Obviously, I was testing with the debugger on. I was able to reproduce your issues upon applying diff you provided. I was able to fix this issue by starting the debugger with --reset-cache flag. Tell me if this fixes your issue.

I'm using npx to run the app, not sure whether I can pass --reset-cache flag with that.

You should be able to use flag even if you use npx, but pretty sure you shouldn't use it. We use npx only to initialize the new projects.

I ran npm start -- --reset-cache and then started the app using react-native run-ios, but the issue still exists. Previously I used npx react-native run-ios to run the app.

Will it be possible for you to list the commands I need to execute? So that I can do a retry.

I completely reboot my OS mojave, and from the first start I have this issue!!! Please help!

None of these files exist:

  • debugger-ui/ui.cc464243.js(.native|.native.js|.js|.native.json|.json|.native.ts|.ts|.native.tsx|.tsx)
  • debugger-ui/ui.cc464243.js/index(.native|.native.js|.js|.native.json|.json|.native.ts|.ts|.native.tsx|.tsx)
    at ModuleResolver.resolveDependency (/Volumes/Samsung_T5/iMac/work/videoCalls/node_modules/metro/src/node-haste/DependencyGraph/ModuleResolution.js:163:15)
    at ResolutionRequest.resolveDependency (/Volumes/Samsung_T5/iMac/work/videoCalls/node_modules/metro/src/node-haste/DependencyGraph/ResolutionRequest.js:52:18)
    at DependencyGraph.resolveDependency (/Volumes/Samsung_T5/iMac/work/videoCalls/node_modules/metro/src/node-haste/DependencyGraph.js:287:16)
    at /Volumes/Samsung_T5/iMac/work/videoCalls/node_modules/metro/src/lib/transformHelpers.js:267:42
    at Server. (/Volumes/Samsung_T5/iMac/work/videoCalls/node_modules/metro/src/Server.js:841:41)
    at Generator.next ()
    at asyncGeneratorStep (/Volumes/Samsung_T5/iMac/work/videoCalls/node_modules/metro/src/Server.js:99:24)
    at _next (/Volumes/Samsung_T5/iMac/work/videoCalls/node_modules/metro/src/Server.js:119:9)
    Error: Unable to resolve module ./debugger-ui/ui.7beef9ab.css from ``:

I completely reboot my OS mojave, and from the first start I have this issue!!! Please help!

None of these files exist:

debugger-ui/ui.cc464243.js(.native|.native.js|.js|.native.json|.json|.native.ts|.ts|.native.tsx|.tsx)
debugger-ui/ui.cc464243.js/index(.native|.native.js|.js|.native.json|.json|.native.ts|.ts|.native.tsx|.tsx)
at ModuleResolver.resolveDependency (/Volumes/Samsung_T5/iMac/work/videoCalls/node_modules/metro/src/node-haste/DependencyGraph/ModuleResolution.js:163:15)
at ResolutionRequest.resolveDependency (/Volumes/Samsung_T5/iMac/work/videoCalls/node_modules/metro/src/node-haste/DependencyGraph/ResolutionRequest.js:52:18)
at DependencyGraph.resolveDependency (/Volumes/Samsung_T5/iMac/work/videoCalls/node_modules/metro/src/node-haste/DependencyGraph.js:287:16)
at /Volumes/Samsung_T5/iMac/work/videoCalls/node_modules/metro/src/lib/transformHelpers.js:267:42
at Server. (/Volumes/Samsung_T5/iMac/work/videoCalls/node_modules/metro/src/Server.js:841:41)
at Generator.next ()
at asyncGeneratorStep (/Volumes/Samsung_T5/iMac/work/videoCalls/node_modules/metro/src/Server.js:99:24)
at _next (/Volumes/Samsung_T5/iMac/work/videoCalls/node_modules/metro/src/Server.js:119:9)
Error: Unable to resolve module ./debugger-ui/ui.7beef9ab.css from ``:

@VitaliyGaliy Got this issue and manage to fix it by deleting yarn.lock then run yarn install. It may got some version conflict when upgrading packages.

I didn use yarn this time. Just npm install from the first start on the new OS.

So, you should try delete package-lock file then run npm install again

No difference, it happens even with a new created react native app
npx react-native init MyTestApp

MAP ./index.js 鈻戔枒鈻戔枒鈻戔枒鈻戔枒鈻戔枒鈻戔枒鈻戔枒鈻戔枒 0.0% (0/1)Error: Unable to resolve module ./debugger-ui/debuggerWorker.d9da4ed7.js from ``:

None of these files exist:

  • debugger-ui/debuggerWorker.d9da4ed7.js(.native|.native.js|.js|.native.json|.json|.native.ts|.ts|.native.tsx|.tsx)
  • debugger-ui/debuggerWorker.d9da4ed7.js/index(.native|.native.js|.js|.native.json|.json|.native.ts|.ts|.native.tsx|.tsx)

Do they exist though? Running watchman watch-del-all may help in such occasions, to clear watcher cache and re-crawl files

watchman watch-del-all - didnt solve my problem. In console I have
Screen Shot 2020-04-06 at 1 40 43 PM

@Esemesek --reset-cache didn't resolve the issue for me. And this issue started after accidentally running npm audit fix.

According to a friend who has done React Native development couple of years, this might be caused to due to React Native core not being upgraded properly.

I also have the issue. Even starting from scratch with npx react-native init test
It happens on physical and emulated devices. Flipper and react-devtools work fine.

I have the same message Unable to resolve module ./debugger-ui/debuggerWorker.d9da4ed7.js from ``:

But the file does exist in node_modules\@react-native-community\cli-debugger-ui\build\ui and http://localhost:8081/debugger-ui/debuggerWorker.d9da4ed7.js displays the file
With React Native version 0.61.5 i don't have issues

@boulgom I also experienced the same issue as you have explained above and decided to revert back from 0.62.0 to 0.61.5 since everything was working fine earlier.

I'm experiencing a similar issue after upgrading from react-native 0.61.5 to 0.62.2

Error: Unable to resolve module `./debugger-ui/debuggerWorker.cff11639` from ``:

It's reproducible in an existing project and a new project from template, but it only occurs on a physical device. In the simulator, debug mode works fine. Even with one packager instance running, the simulator will behave correctly and the physical device experiences the issue.

watchman watch-del-all && npm start -- --reset-cache and removing package-lock.json and yarn.lock have not made a difference.

@jessecureton if the app was already installed on the device before making the change, have you tried deleting it and installing it again with the latest changes?

Yes, this occurs for me in both an existing project updated to 0.62.2 and a clean-slate project initialized from react-native init. I actually went as far as removing every app signed by this developer profile from the device and reinstalling, and it still occurs.

I filed a more thorough report here, since the on-device error leads me to believe its react-native related more than it is debugger related.

I'm experiencing this issue on both 0.62.0 and 0.62.2

Error: Unable to resolve module ./debugger-ui/ui.7beef9ab.css from ``:

None of the above-mentioned methods have worked.
I have checked and file node_modules/@react-native-community/cli-debugger-ui/build/ui/ui.7beef9ab.css exists

Disabling debugging makes simulator load bundle, but only a white screen is displayed until Bundle location is changed to localhost:8081 and app is restarted Then app works until debugging is enabled again

Solved it for me in two ways:

First I simply removed the sourceMappingURL from the mentioned files,
as these seemed to raise the error (build problems?).
But as I had to redo this on any package update / addition (which got quite annoying, as you might have guessed ; ), I was quite happy that @react-native-community/cli-debugger-ui v4.7.0 has been released yesterday!
So I quickly added the following to my package.json:

  "resolutions": {
    "@react-native-community/cli-debugger-ui": "4.7.0"
  }

Now, after deleting yarn.lock, running react-native clean-project-auto (the same could have been accomplished by deleting node_modules, cleaning the individual builds & pods, but react-native-clean-project is so much neater % ) & running yarn again, the problem was gone.
(Be sure to remove the resolution, when RN updates again...)

Hope it helps anyone!

Best,

Tim.

I tried doing as @timhagn said, but for me, this hasn't fixed anything..... It still throws the same error The Only difference being that it does that after, not before it creates bundle and map.

hi, i have try using
"resolutions": { "@react-native-community/cli-debugger-ui": "4.7.0" }

but still disable ability touchable, ex: onPress is not working, but if not in debug mode, it working normaly

Hi @tamacroft,

sad to read, that the resolutions field doesn't work for you,
have you tried removing the sourceMappingURLs?

And in my experience the onPress functionality depends on Device Timers.
So (for Android Emulator), a quick

adb shell "date `date +%m%d%H%M%Y.%S`"

should sync device times, again. For physical devices deactivating automatic time often helped.
But yeah, it's annoying (and there already are a few issues about over at the RN repo)...

Hi Guys, was having the same problem and was unable to interact with the App. But only on the device.
This solution may work (tried only on windows and android device)

visit chrome://inspect/
you will see the listed device connected. If an android device is connect you can view
Chrome(version) along with enter url option next to it. enter the
http://localhost:8081/debugger-ui/ and click open.
this will create a tab(below the enter url option,will take a sec or few) click inspect. this will open a chrome inspect element in which you can view debugger console.
see if the app interacts as expected and Touchable elements are working fine.

if it works fine. the pc remote debugger time sync is the issue. set time manually for both pc and the device and check, this should fix the problem.

probably it's due to different versions of the modules , @r0b0t3d solution works for me!

Hi @timhagn,
I am getting this issue only while debugging using physical device.
I quite did not understand what you said about deactivating automatic time.

Hi @sudpmishra,

drifting debugger and device times is quite an old problem for many, this time it seems to have really reached us on a basic level (Touchables). Like stated by @alexciarillo in an issue comment over at the react-native repo:

I believe I ended up tracking this down to an issue with there being a time difference between the host and device. Since the time is off, the calculation for whether it was a short press or long press is broken (or something like that). You can verify this by running adb shell "date" && date to see if the times are off. I think I was usually able to fix this by going into the device settings, disabling automatic time resolution, and then re-enabling it. I think there was also a way to do this via an adb command but can't recall what it is.

As my previously mentioned solution sadly only works on rooted devices (Android 6 & up, I think), one is at least possible ("the way to do this via an adb command"):

# Deactivate automatic device time:
adb shell settings put global auto_time 0
# Reactivate automatic device time via an ntp server:
adb shell settings put global auto_time 1

No guarantees, but I hope it helps : ).

Best,

Tim.

Solved it for me in two ways:

First I simply removed the sourceMappingURL from the mentioned files,
as these seemed to raise the error (build problems?).
But as I had to redo this on any package update / addition (which got quite annoying, as you might have guessed ; ), I was quite happy that @react-native-community/cli-debugger-ui v4.7.0 has been released yesterday!
So I quickly added the following to my package.json:

  "resolutions": {
    "@react-native-community/cli-debugger-ui": "4.7.0"
  }

Now, after deleting yarn.lock, running react-native clean-project-auto (the same could have been accomplished by deleting node_modules, cleaning the individual builds & pods, but react-native-clean-project is so much neater % ) & running yarn again, the problem was gone.
(Be sure to remove the resolution, when RN updates again...)

Hope it helps anyone!

Best,

Tim.

I resolved this issue by install version "@react-native-community/cli-debugger-ui": "3.0.0"

I am also having difficulties with this. Nothing above works^. Any have another solution?

@pvanny1124 I think you should clean and rebuild you application
cd android && gradlew.bat clean && cd ../ && npx react-native run-android

For me, what fixed it was removing

"plugins": [
    "@babel/plugin-proposal-class-properties"
  ]

from my babel.config.js. None of the other methods worked.

No idea why this fixes it but hey, it works!

@AlexDM0 changing babel config invalidated Metro cache most likely

I cleared the watchman cache, react-native start --clear-cache etc. Tried everything I could find. Hope it helps someone!

Edit: and the cache clearing didnt fix it, only removing the plugin from the babel config solved my issue. To be fair, I added that plugin a few days ago because jest wanted it.

@AlexDM0 I don't have that plugin, so something seems very off. here's my package.json:

{
    "name": "sample",
    "version": "0.0.1",
    "private": true,
    "scripts": {
        "android": "react-native run-android",
        "ios": "react-native run-ios",
        "start": "react-native start",
        "test": "jest",
        "lint": "eslint --fix --ignore-path .gitignore --ignore-path .eslintignore .",
        "reset": "react-native start --reset-cache",
        "build-apk": "cd android && ./gradlew assembleRelease",
        "testflight": "cd ios && pod install && fastlane beta",
        "pod-install": "cd ios && pod install",
        "android-bundle": "react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle",
        "xcode": "cd ios && xed ."
    },
    "dependencies": {
        "@react-native-community/async-storage": "^1.9.0",
        "@react-native-community/cli-debugger-ui": "^4.7.0",
        "@react-native-community/masked-view": "^0.1.10",
        "@react-native-firebase/app": "^6.7.1",
        "@react-native-firebase/auth": "^6.7.1",
        "@react-native-firebase/messaging": "^6.7.1",
        "@react-navigation/compat": "^5.1.10",
        "@react-navigation/drawer": "^5.5.1",
        "@react-navigation/native": "^5.1.7",
        "@react-navigation/stack": "^5.2.14",
        "jwt-decode": "^2.2.0",
        "lodash": "^4.17.15",
        "moment": "^2.24.0",
        "native-base": "^2.13.12",
        "node-emoji": "^1.10.0",
        "node-fetch": "^2.6.0",
        "react": "16.11.0",
        "react-native": "0.62.2",
        "react-native-fade-in-view": "^1.0.6",
        "react-native-fast-image": "^8.1.5",
        "react-native-fbsdk": "^1.1.2",
        "react-native-gesture-handler": "^1.6.1",
        "react-native-keyboard-spacer": "^0.4.1",
        "react-native-mixpanel": "^1.2.0",
        "react-native-picker-select": "^7.0.0",
        "react-native-reanimated": "^1.8.0",
        "react-native-safe-area-context": "^0.7.3",
        "react-native-screens": "^2.7.0",
        "react-native-size-matters": "^0.3.0",
        "react-native-vector-icons": "^6.6.0",
        "react-native-video": "^4.4.5",
        "redux": "^4.0.5",
        "socket.io-client": "^2.3.0"
    },
    "devDependencies": {
        "@babel/core": "7.9.0",
        "@babel/runtime": "7.9.2",
        "@react-native-community/eslint-config": "0.0.5",
        "babel-jest": "24.9.0",
        "babel-plugin-transform-inline-environment-variables": "^0.4.3",
        "eslint": "6.8.0",
        "jest": "^24.9.0",
        "metro-react-native-babel-preset": "0.58.0",
        "react-native-clean-project": "^3.3.0",
        "react-test-renderer": "16.11.0"
    },
    "resolutions": {
        "@react-native-community/cli-debugger-ui": "4.7.0"
    },
    "jest": {
        "preset": "react-native",
        "testPathIgnorePatterns": [
            "node_modules/(?!(react-[a-z, -]*|react-native|native-base-[a-z, -]*|react-native-[a-z, -]*)/)",
            "/node_modules/@react-native-community/async-storage/(?!(lib))"
        ],
        "transformIgnorePatterns": [
            "node_modules/(?!(@react-native-community|react-native|react-navigation))"
        ],
        "setupFiles": [
            "./jestSetupFile.js"
        ]
    }
}


I should mention that this is happening to my iOS build

I solved this issue, check your app name

AppRegistry.registerComponent('realmapp', () => appContainer)

app name was the issue in my case

Nothing mentioned here solved my issue. I'm having this both on Android and iOS.

The error log is:
ui.bcd3f9d1.js:16 GET http://localhost:8081/debugger-ui/debuggerWorker.cff11639.js 404 (Not Found)

And there are following errors in debugger network:
Screenshot 2020-05-03 at 13 51 25

Same problem here with file debuggerWorker.cff11639.js ! None of the above solutions worked for me.

Same issue, the only solution who worked for me was to downgrade React native ...

I had the same issue.

I created a RN project 2 weeks ago and in my package-lock.json the version of the cli was set to 4.7.0 (included by react-native with ^4.5.1) -> everything worked fine
But for a fresh install or a removal of package-lock + npm install it does install the version 4.8.0
-> It does display the error described above.

My solution for the moment is to freeze the version in the package-lock to the version 4.7.0.

If you have a better solution I would be happy to apply it.

Same issue here, no solution worked with RN 0.62.2

Hi all, I found I encountered this error when I had a bug in one my of components, not related to the debugger. My debugger window (http://localhost:8081/debugger-ui/) was open. I checked it and sure enough there was a console error that led me to the real issue.

Just a heads up, deleted my node_modules and deleted my package-lock.json solved my issue.
This is getting really annoying to do almost every time something gets stale. not sure why this keeps happening year after year.

Same issue when we used the "npx react-native init *" created the lastest template. For now freeze the version "@react-native-community/cli-debugger-ui" to 4.7.0 works for me.

I found this answer on stack overflow useful. Hard reload solved my issue.

https://github.com/facebook/react-native/issues/28531#issuecomment-612465766

I fixed it by disabling remote debugger and reenabling it.

this was the solution for me https://stackoverflow.com/a/60755519/1557613

this was the solution for me https://stackoverflow.com/a/60755519/1557613

Hard refresh of the debugger window also worked for me (cmd + shift + r)

Just try all the ways I found still failed,
the easiest one for me is to clone the repository, install and build again.

this was the solution for me https://stackoverflow.com/a/60755519/1557613

Hard refresh of the debugger window also worked for me (cmd + shift + r)

yeah but I noticed we have to redo this if we restart our machines.

I'm getting this on RN 0.61.4, expo 37.0.12. Using yarn workspaces, not sure if that's relevant.

Here as well. Bare expo project w/

  • RN @ 0.61.5
  • Expo @ 37.0.3
    Was working fine till an hour ago. Had to reboot my laptop, and afterwards project wouldn't work anymore.

this was the solution for me https://stackoverflow.com/a/60755519/1557613

Hard refresh of the debugger window also worked for me (cmd + shift + r)

This worked for me too!

I tried all the solutions suggested here and nothing worked for me, still the exact same error.

Is there an alternative to that remote debugger?

After deleting my cache and reloading chrome it didn't help, I even tried to restart my pc and nothing of course. But then today it started working again without me doing anything. Really strange

@timhagn solution of setting the resolutions to RN debugger CLI version 4.7.0 and installing that specific version worked for me. I'm using RN v0.62.2. I also reset the cache after npm install and before re-running with npx.

If it helps someone, I have noticed that this error appears also after changing something in _package.json_ such as the app version and not use _npm install_ command before running. If I ran install after changing the _version_ property, the _package-lock.json_ probably changed and the debugger worked again.

I didn't expect that the version would affect the debugger, since without Debugging on, the application still works. Guess it's best to always run the install command after changing something in _package.json_, even for options unrelated to packages.

None of these solutions worked for me, but the note about onPress being time-sensitive lead me to the right result:

https://github.com/facebook/react-native/issues/28531#issuecomment-640342824

I got same the issue. when I open the debugger in the console I am getting this error.
I spent more to debug this error.

Solution
I used resolutions in the package.json.
"resolutions": { "@react-native-community/cli-debugger-ui": "4.7.0" },
then I deleted package-lock.json and node_modules.
then I reinstalled node modules, synced with the android studio.
clean the project.
Finally, used react-native run-android

Having the same issue after upgrading to Expo SDK 38 and RN 0.62. None of the suggested fixes have worked.

I have the same problem, no expo, but RN 0.62.2, none of the fixes worked. Since the error lies in the cli-debugger, probably, the App still runs when started with android studio, so maybe that might help a few people continue development?

For expo users, I think you accidently turned on Live Debugging in Expo, Just clear Expo's Cache and Data from your Phone, and everything will be back to normal.

For expo users, I think you accidently turned on Live Debugging in Expo, Just clear Expo's Cache and Data from your Phone, and everything will be back to normal.

@chandan1602

I tried uninstalling the app on the simulator and reinstalling. That didnt help. Is there another way to clear cache and data from the expo app?

For expo users, I think you accidently turned on Live Debugging in Expo, Just clear Expo's Cache and Data from your Phone, and everything will be back to normal.

@chandan1602

I tried uninstalling the app on the simulator and reinstalling. That didnt help. Is there another way to clear cache and data from the expo app?

Do you get the same error now, my method was plain and simple, i just opened the app info, and from there i cleared the app cache and data, also i ran expo r -c and collectively that worked for me

Unfortunately none of the above solutions work for me 馃槩

After updating to RN 63.0, I still get the error, but the app compiles nonetheless and is debuggable.

I was getting this error => Error: Unable to resolve module `./debugger-ui/debuggerWorker.d9da4ed7` from ``:
I am able to solve this by doing Ctrl+C to stop bundle and running npm start again

this is just retarded. spending 1 hour to try and debug this app...

For some reason what worked for me was to use my IP like 192.168.31.91:8081/debugger-ui instead of the default localhost:8081/debugger-ui

Running "empty cache and hard reload" on the debugger page in Chrome as mentioned here fixes the issue for me.

After struggling with this issue for a long time i tried a combination of methods which I have found in this topic and expo forum, and it works for me!

I did what notbrent described in this post , and in package.json add this line ( yep, in 3.0.0 version)

"resolutions": { "@react-native-community/cli-debugger-ui": "3.0.0" },

delete this:

"plugins": [ "@babel/plugin-proposal-class-properties" ]

Hope it will help somebody

And after few days it just stop working.

Now I don't have any error message. I just can't touch anything.

My god, how shitty it is...

Same Error. RN version: 0.63.2

above solutions no work for me....

I added "resolutions" but it didn't help.

"resolutions": {
   "@react-native-community/cli-debugger-ui": "4.7.0"
 },

After that I did "yarn add react-devtools-core" and the error went away.

Been 2 days and still havent found the fix on this

Still no fix for this? Should we go flutter now?

Still no fix for this? Should we go flutter now?

On my side the issue cause by react-native-reanimated@2, I removed it and the issue disappear. maybe try to check your libs

Still no fix for this? Should we go flutter now?

On my side the issue cause by react-native-reanimated@2, I removed it and the issue disappear. maybe try to check your libs

How to know what's causing the issue from the libraries tho

Still no fix for this? Should we go flutter now?

On my side the issue cause by react-native-reanimated@2, I removed it and the issue disappear. maybe try to check your libs

How to know what's causing the issue from the libraries tho

It's not only about libraries. I tried to start new project on new machine and it sometimes works, sometimes not...

this is such a mess, does anyone actually have a fix?

I tried to delete the build in _android/app/build_ folder and the node_modules folder, on the terminal I launched _npm install && npm cache clean --force_, then navigated to the android folder and ran _./gradlew installDebug_ checked syntax errors when importing libraries and two of them were missing the braces {} between the variable name, just so it worked, try to observe if the libraries are compatible with the versions of another library, I believe it is a bug between the version of react and the requested libraries

For expo users, I think you accidently turned on Live Debugging in Expo, Just clear Expo's Cache and Data from your Phone, and everything will be back to normal.

Thank you so much!!! saved my project

Mac OS Catalina
Android Emulator
"react-native": "0.63.2"

I've tried to clear the cache and reinstalling node modules, none of that works for me. Reinstalling the app in the emulator seems to do the trick.

Hope it helps!

Does anyone have a fix for this yet?

have the same problem' non of the above helps.

specific Error

Error: Unable to resolve module ./debugger-ui/ui.bcd3f9d1.js from ``:

None of these files exist:

  • debugger-ui\ui.bcd3f9d1.js(.native|.native.expo.ts|.expo.ts|.native.expo.tsx|.expo.tsx|.native.expo.js|.expo.js|.native.expo.jsx|.expo.jsx|.native.ts|.ts|.native.tsx|.tsx|.native.js|.js|.native.jsx|.jsx|.native.json|.json|.native.wasm|.wasm)
  • debugger-ui\ui.bcd3f9d1.js\index(.native|.native.expo.ts|.expo.ts|.native.expo.tsx|.expo.tsx|.native.expo.js|.expo.js|.native.expo.jsx|.expo.jsx|.native.ts|.ts|.native.tsx|.tsx|.native.js|.js|.native.jsx|.jsx|.native.json|.json|.native.wasm|.wasm)
    at ModuleResolver.resolveDependency (C:\Users\yadin\DoneWithIt2node_modules\metro\src\node-haste\DependencyGraph\ModuleResolution.js:163:15)
    at ResolutionRequest.resolveDependency (C:\Users\yadin\DoneWithIt2node_modules\metro\src\node-haste\DependencyGraph\ResolutionRequest.js:52:18)
    at DependencyGraph.resolveDependency (C:\Users\yadin\DoneWithIt2node_modules\metro\src\node-haste\DependencyGraph.js:287:16)
    at C:\Users\yadin\DoneWithIt2node_modules\metro\src\lib\transformHelpers.js:267:42
    at Server. (C:\Users\yadin\DoneWithIt2node_modules\metro\src\Server.js:841:41)
    at Generator.next ()
    at asyncGeneratorStep (C:\Users\yadin\DoneWithIt2node_modules\metro\src\Server.js:99:24)
    at _next (C:\Users\yadin\DoneWithIt2node_modules\metro\src\Server.js:119:9)

Same problem on Windows 10 with RN 0.62.2

If someones having the problem still, try using react-navigation v4. I had v5 and downgraded it to v4 and it worked.

In expo app, I resolve by install react-native-debugger-open

yarn add -D react-native-debugger-open

And add this script to package.json, use yarn debug to start expo dev server.

"debug": "REACT_DEBUGGER=\"rndebugger-open --open --expo\" expo start"

With --expo flag, react-native-debugger-open auto use expo's correct port.

Turn on Debug Remote JS in expo app, react-native-debugger will auto launch, and redux-devtools is work.

I use in expo 39 and react-native-debugger installed.
Both redux-devtools-extension and window.__REDUX_DEVTOOLS_EXTENSION__ are work.

faced the same and solved by just restarting the bundler with --reset-cache.

yarn start --reset-cache

I encountered the same issue, so far I've been working only with the iOS simulator

RN version:

"react": "16.13.1",
"react-native": "0.63.3",

what worked for me was removing the app from the simulator and installing it again

This problem I resolved by stoping debugging remote JS in expo app.

if you want to get a proper fix for this, if you're using react-native 0.63 (or expo sdk 39+) then delete your node_modules and lockfile (yarn.lock or package-lock.json) and run yarn/npm install again. this will pull in the latest version of @react-native-community/cli that includes a fix

if you want to get a proper fix for this, if you're using react-native 0.63 (or expo sdk 39+) then delete your node_modules and lockfile (yarn.lock or package-lock.json) and run yarn/npm install again. this will pull in the latest version of @react-native-community/cli that includes a fix

Tried that. Didn't help.

https://github.com/facebook/react-native/issues/28844#issuecomment-730535093

sorry i'm not sure what your issue might be. could you try to investigate the root cause and report back?

No idea either...

sigh, this is depressing

In expo app, I resolve by install react-native-debugger-open

yarn add -D react-native-debugger-open

And add this script to package.json, use yarn debug to start expo dev server.

"debug": "REACT_DEBUGGER=\"rndebugger-open --open --expo\" expo start"

With --expo flag, react-native-debugger-open auto use expo's correct port.

Turn on Debug Remote JS in expo app, react-native-debugger will auto launch, and redux-devtools is work.

I use in expo 39 and react-native-debugger installed.
Both redux-devtools-extension and window.__REDUX_DEVTOOLS_EXTENSION__ are work.

Thank you @CacaoRick That fixed it for me

its been bloddy 9 months and no solution yet?! wtf!

suddenly started having this issue too. stuck for hours now

@lordival try to run brew upgrade and install the latest watchman
now i dont have this issue anymore

Faced the same issue when I tried to open "Debug" menu:
` Error: Unable to resolve module `./debugger-ui/debuggerWorker.aca173c4` from:

None of these files exist:

  • debugger-ui/debuggerWorker.aca173c4(.native|.native.js|.js|.native.json|.json|.native.ts|.ts|.native.tsx|.tsx)
  • debugger-ui/debuggerWorker.aca173c4/index(.native|.native.js|.js|.native.json|.json|.native.ts|.ts|.native.tsx|.tsx)
    ```

react-native info
System: OS: macOS 10.15.7 CPU: (16) x64 Intel(R) Core(TM) i9-9980HK CPU @ 2.40GHz Memory: 1.00 GB / 32.00 GB Shell: 3.2.57 - /bin/bash Binaries: Node: 14.15.1 - /usr/local/bin/node Yarn: 1.17.3 - /usr/local/bin/yarn npm: 6.14.8 - /usr/local/bin/npm Watchman: 4.9.0 - /usr/local/bin/watchman Managers: CocoaPods: 1.10.0 - /usr/local/bin/pod SDKs: iOS SDK: Platforms: iOS 14.4, DriverKit 20.2, macOS 11.1, tvOS 14.3, watchOS 7.2 Android SDK: API Levels: 28, 29 Build Tools: 28.0.3, 29.0.2, 29.0.3 System Images: android-22 | Google APIs ARM EABI v7a, android-22 | Google APIs Intel x86 Atom_64, android-24 | Google Play Intel x86 Atom, android-28 | Intel x86 Atom_64, android-28 | Google APIs Intel x86 Atom, android-29 | Google APIs Intel x86 Atom, android-R | Google Play Intel x86 Atom Android NDK: Not Found IDEs: Android Studio: 3.6 AI-192.7142.36.36.6392135 Xcode: 12.4/12D4e - /usr/bin/xcodebuild Languages: Java: 1.8.0_232 - /usr/bin/javac Python: 2.7.16 - /usr/bin/python npmPackages: @react-native-community/cli: Not Found react: 16.13.1 => 16.13.1 react-native: 0.63.4 => 0.63.4 react-native-macos: Not Found npmGlobalPackages: *react-native*: Not Found

I tried a couple different methods mentioned here, but the thing that finally fixed it for me was:

_Reset the repo (remove all untracked, and ignored files etc.) and yarn cache:_
Please make sure you know what the git clean command does exactly before running it and possibly losing your work

$ git clean -dfx
$ yarn cache clean

_Then cleaning xcode build datas:_

$ rm -rf ~/Library/Developer/Xcode/DerivedData

_Fresh install:_

$ yarn
$ cd ios && pod install

_And finally running the bundler:_

$ yarn start --reset-cache

For me I see this error repeatedly in the metro bundler output, which is a bit annoying, but it doesn't affect my ability to debug the app in any way, as it loads the bundle index afterwards anyway.

On my end this error evolved after an upgrade to ReactNative 0.64.0, now i get this one in a terminal

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 (/Users/victorsheyanov/code/expert-guidion-app/node_modules/metro/src/node-haste/DependencyGraph/ModuleResolution.js:347:17)
    at new UnableToResolveError (/Users/victorsheyanov/code/expert-guidion-app/node_modules/metro/src/node-haste/DependencyGraph/ModuleResolution.js:333:35)
    at ModuleResolver.resolveDependency (/Users/victorsheyanov/code/expert-guidion-app/node_modules/metro/src/node-haste/DependencyGraph/ModuleResolution.js:211:15)
    at DependencyGraph.resolveDependency (/Users/victorsheyanov/code/expert-guidion-app/node_modules/metro/src/node-haste/DependencyGraph.js:413:43)
    at /Users/victorsheyanov/code/expert-guidion-app/node_modules/metro/src/lib/transformHelpers.js:317:42
    at /Users/victorsheyanov/code/expert-guidion-app/node_modules/metro/src/Server.js:1471:14
    at Generator.next (<anonymous>)

Chrome console:
image

And it's true, debuggerWorker.aca173c4.js.map is not present in a build directory, only .js:
image

I checked with our team (Mac + Ubuntu OS), none of them has this .js.map file requested by Chrome when debugging and all of us has same error (either unable to resolve... or illegal operation on a directory...) that is cause by ChromeDebugger requesting 1 file: http://localhost:8081/debugger-ui/debuggerWorker.aca173c4.js.map

I did stick a console.log in a place where this error is thrown:
image
result:
image

Obviously /Users/victorsheyanov/code/expert-guidion-app/debugger-ui/debuggerWorker.aca173c4.js is incorrect path as it should be /Users/victorsheyanov/code/expert-guidion-app/node_modules/@react-native-community/cli-debugger-ui/build/ui/debuggerWorker.aca173c4.js

Any ideas what module can cause this problem?

PS. just to be clean, requesting .map file causes this error with debuggerWorker.aca173c4.js:
image
PPS: debugging works anyway, but this scary error as annoying as hell...

I tried to fix the issues by patching metro to resolve the debugger-ui-related paths to the correct local paths, and was able to get rid of the errors described by @vsheyanov. However, in my case debugging still doesn't work (the app gets stuck after requesting those files). For now, I'm relying on Hermes debugging on Android, as none of the other solutions worked (it also happens on my colleagues' machines, as well as both on my Linux and MacOS machines, so it doesn't seem to be something local). Will try to get back to this with more info when I have time to investigate further.

Still no progress in this? We are nearly in April... Really sad for a production framework.

Still no progress in this?

I wouldn't expect progress on a ticket that's been closed. If it's still an issue I'd suggest raising a new ticket, ideally with reproduction steps or getting this ticket reopened.

In my case, previously I did a change on AppDelegate.m, because of a problem with Flipper on physical devices, as described here 28419.

I just take off the 'TARGET_OS_SIMULATOR' condition, and now I can debug normally.

The problem cause:
`#if DEBUG && TARGET_OS_SIMULATOR
return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index" fallbackResource:nil];

else

return [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];

endif`

Now working:
`#if DEBUG
return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index" fallbackResource:nil];

else

return [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];

endif`

Was this page helpful?
0 / 5 - 0 ratings