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

Please provide all the information requested. Issues that do not follow this format are likely to stall.

Description

Please provide a clear and concise description of what the bug is. Include screenshots if needed. Please test using the latest React Native release to make sure your issue has not already been fixed: https://reactnative.dev/docs/upgrading.html

React Native version:

npx react-native info
info Fetching system and libraries information...
System:
    OS: macOS 10.15.4
    CPU: (12) x64 Intel(R) Core(TM) i9-8950HK CPU @ 2.90GHz
    Memory: 43.02 MB / 32.00 GB
    Shell: 3.2.57 - /bin/bash
  Binaries:
    Node: 14.1.0 - /usr/local/bin/node
    Yarn: 1.10.1 - /usr/local/bin/yarn
    npm: 6.14.4 - /usr/local/bin/npm
    Watchman: 4.9.0 - /usr/local/bin/watchman
  Managers:
    CocoaPods: 1.9.1 - /usr/local/bin/pod
  SDKs:
    iOS SDK:
      Platforms: iOS 13.4, DriverKit 19.0, macOS 10.15, tvOS 13.4, watchOS 6.2
    Android SDK:
      API Levels: 26, 27, 28, 29
      Build Tools: 26.0.2, 27.0.3, 28.0.3, 29.0.1, 29.0.2
      System Images: android-23 | Google APIs Intel x86 Atom_64, android-28 | Google APIs Intel x86 Atom, android-28 | Google Play Intel x86 Atom, android-29 | Google Play Intel x86 Atom
      Android NDK: Not Found
  IDEs:
    Android Studio: 3.6 AI-192.7142.36.36.6392135
    Xcode: 11.4.1/11E503a - /usr/bin/xcodebuild
  Languages:
    Java: 1.8.0_211 - /usr/bin/javac
    Python: 2.7.17 - /usr/local/bin/python
  npmPackages:
    @react-native-community/cli: Not Found
    react: 16.11.0 => 16.11.0 
    react-native: 0.62.2 => 0.62.2 
  npmGlobalPackages:
    *react-native*: Not Found

Steps To Reproduce

Provide a detailed list of steps that reproduce the issue.

  1. run npx react-native init Blah --template react-native-template-typescript
  2. run npx react-native start
  3. run npx react-native run-android
  4. Tell app to use debug mode
  5. See exception:
Error: Unable to resolve module `./debugger-ui/debuggerWorker.cff11639.js` from ``: 

None of these files exist:
  * debugger-ui/debuggerWorker.cff11639.js(.native|.native.js|.js|.native.json|.json|.native.ts|.ts|.native.tsx|.tsx)
  * debugger-ui/debuggerWorker.cff11639.js/index(.native|.native.js|.js|.native.json|.json|.native.ts|.ts|.native.tsx|.tsx)
    at ModuleResolver.resolveDependency (/Users/scott.pierce/workspace/test/example/example-react-native/node_modules/metro/src/node-haste/DependencyGraph/ModuleResolution.js:163:15)
    at ResolutionRequest.resolveDependency (/Users/scott.pierce/workspace/test/example/example-react-native/node_modules/metro/src/node-haste/DependencyGraph/ResolutionRequest.js:52:18)
    at DependencyGraph.resolveDependency (/Users/scott.pierce/workspace/test/example/example-react-native/node_modules/metro/src/node-haste/DependencyGraph.js:287:16)
    at /Users/scott.pierce/workspace/test/example/example-react-native/node_modules/metro/src/lib/transformHelpers.js:267:42
    at Server.<anonymous> (/Users/scott.pierce/workspace/test/example/example-react-native/node_modules/metro/src/Server.js:841:41)
    at Generator.next (<anonymous>)
    at asyncGeneratorStep (/Users/scott.pierce/workspace/test/example/example-react-native/node_modules/metro/src/Server.js:99:24)
    at _next (/Users/scott.pierce/workspace/test/example/example-react-native/node_modules/metro/src/Server.js:119:9)

Expected Results

I wouldn’t get this error.

About this issue

  • Original URL
  • State: closed
  • Created 4 years ago
  • Reactions: 202
  • Comments: 166 (4 by maintainers)

Commits related to this issue

Most upvoted comments

Resolved for me by hard refreshing (shift + refresh) the React debugger tab in Chrome, then clearing application data in inspector, then finally restarting the main bundler thread in bash (npm start)

I uninstalled completely the app from my device, and it turned it back to work without the error 🤔 (Android device)

Any solution to this? It seems it happens on React Native 0.62.2 even if you create a fresh project. For some reason there is an error 500 when you look at the debugger.

Screen Shot 2020-06-19 at 12 08 04 PM

just skip it, it doesn’t matter as long as it doesn’t cause application error

Reverting back to react-native 0.23.1 from 0.62.2 solved it for me

It is happening everytime I switch from debugging from bash to chrome, while it’s showing the logs in metro bundler, and I click debug in the rn menu

edit: it’s basically forcing us to use the metro bundler, and not chrome to debug. When I set the app from the menu to debug mode, when javascript logs are going to the browser console, I receive this error

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

None of these files exist:
  * debugger-ui/debuggerWorker.cff11639.js(.native|.native.js|.js|.native.json|.json|.native.ts|.ts|.native.tsx|.tsx)
  * debugger-ui/debuggerWorker.cff11639.js/index(.native|.native.js|.js|.native.json|.json|.native.ts|.ts|.native.tsx|.tsx)
    at ModuleResolver.resolveDependency (/Users/henriquederosa/dev/myapp/node_modules/metro/src/node-haste/DependencyGraph/ModuleResolution.js:163:15)
    at ResolutionRequest.resolveDependency (/Users/henriquederosa/dev/myapp/node_modules/metro/src/node-haste/DependencyGraph/ResolutionRequest.js:52:18)
    at DependencyGraph.resolveDependency (/Users/henriquederosa/dev/myapp/node_modules/metro/src/node-haste/DependencyGraph.js:287:16)
    at /Users/henriquederosa/dev/myapp/node_modules/metro/src/lib/transformHelpers.js:267:42
    at Server.<anonymous> (/Users/henriquederosa/dev/myapp/node_modules/metro/src/Server.js:841:41)
    at Generator.next (<anonymous>)
    at asyncGeneratorStep (/Users/henriquederosa/dev/myapp/node_modules/metro/src/Server.js:99:24)
    at _next (/Users/henriquederosa/dev/myapp/node_modules/metro/src/Server.js:119:9

Hey All, I had this issue and what worked for me was just clearing my Google Chrome cache.

And by ‘worked’ I mean that I didn’t get the red error screen over my simulator & I could continue developing as normal.

Same issue “react-native”: “0.62.2”,

Please just clear your react native project…

I’m also having the same issue when run on debug mode.

After update from RN v0.61.4 to RN v0.63.1.

I made the following steps:

  1. Clear caches: watchman watch-del-all; rm -rf $TMPDIR/metro-*; rm -rf $TMPDIR/haste-map-*;
  2. Remove yarn.lock, node_modules and install packages: rm yarn.lock; rm -rf node_modules; yarn;
  3. Add the following resolutions to package.json:
"resolutions": {
    "@react-native-community/cli-debugger-ui": "4.7.0"
}

After that, I executed project in simulator and everything is okay. ✨

Lol go away stupid bot!

Has anyone found a solution yet? This is ridiculous… Tried literally everything and still here

For anyone that is still stuck on this, checking “Disable cache (while DevTools is open)” in the console settings usually fixes it.

image

@jmlavoier I have the same issue, but don’t use react-native-config.

"react": "16.11.0",
"react-native": "0.62.2",
:warning: Missing Reproducible Example
:information_source: It looks like your issue is missing a reproducible example. Please provide a Snack or a repository that demonstrates the issue you are reporting in a minimal, complete, and reproducible manner.

I’ve been having this issue as well. Searching high and low for an answer. Disabling my ad-blocker gave me more feedback in the console for some reason. And then I noticed chrome was debugging the main thread. Easy to overlook.

Aantekening 2020-06-27 202124

After clicking the debuggerWorker thread, the app started registering and hitting breakpoints… I hope this helps some of you out 👍

Fixed.

Please upgrade CLI to 4.13.1 as per this official React Native CLI guide.

Note this only works on React Native 0.62 and newer. No plans for backwards fixes for older versions.

I analyze the app and device info and find my error reason. my device’s time fast the actual time, after I set the device time as automatic the problem disappear.

I have just discovered that this error disappears when i change my main App to a functional component instead of a class component.

Any help on this? I have tried two different systems and two different app setup. Still the same issue.

i fixed it by deactivate/reactivate wifi on device and on mac same wifi on both

Great to see a fix has been merged here, thanks for the work here. Do we have any idea when this would go live so we can use it?

I’m currently in the process of upgrading from Expo 37 —> 39, and this issue is preventing any debugging work, I guess the Expo guys would need to implement any fixes you put out. I’ve spent about 6 hours trying to find fixes for this, so if anyone knows a short-term solution other than rolling back to 37 let us know.

Disabling cache on the network tab in chrome can help

image

…but not always. I’m pretty sure this issue is what causes the “debugging loads old builds” problem where fast refresh updates your code but upon app reload you end up with an old cached version. That was a fun one to discover… The state of react-native profiling tools and debugging tools (especially with Android emulator) is pretty sad at the moment but unfortunately I don’t have the experience with native code to improve them.

edit: I wonder if this is related to https://github.com/facebook/react-native/issues/29424 ? Although that happens when not debugging as well.

https://github.com/babel/minify/issues/950, This solution helped me,Check your projects,in babel.config.js,‘transform-remove-console’

Faced the same issue. Installing the lastest version of watchman helped me https://facebook.github.io/watchman/docs/install.html

Weird one. The workaround posted by @HenriqueDerosa worked fine for me (Uninstall and Install the app on the device)

Context: This error appeared when I was trying to make a GET request on my application hosted locally

try {
     api.get('/projects').then(response => {   //api has the baseUrl/Computer Ip
        console.log("Done!");
     });
} catch (error) {
     console.log(error);
}

Error:

index.bundle?platfor…&minify=false:41548 Possible Unhandled Promise Rejection (id: 1):
Error: Network Error
Error: Network Error
    at createError (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false:99384:17)
    at EventTarget.handleError (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false:99288:16)
    at EventTarget.dispatchEvent (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false:32277:27)
    at EventTarget.setReadyState (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false:31367:20)
    at EventTarget.__didCompleteResponse (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false:31183:16)
    at http://localhost:8081/index.bundle?platform=android&dev=true&minify=false:31293:47
    at RCTDeviceEventEmitter.emit (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false:3537:37)
    at MessageQueue.__callFunction (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false:2765:31)
    at http://localhost:8081/index.bundle?platform=android&dev=true&minify=false:2497:17
    at MessageQueue.__guard (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false:2719:13)

please how to solve this problems ? im even fresh install from react native init and still get this problem

Has anyone found a solution yet? This is ridiculous… Tried literally everything and still here

Resolved for me by hard-refreshing (shift + refresh) the React debugger tab in Chrome, then clearing application data in the inspector, then finally restarting the main bundler thread in bash (npm start)

Tried this many times. Doesn’t resolve it for me.

When this is happening, I can no longer input text into text fields, as the keyboard doesn’t appear. The debugger becomes unusable, not being able to login into the application.

try it on emulator

On emulator it is working, but the error is still thrown in the bundler. Why is it affecting only device debugging?

when I use the actual device (Android 9) it’s not working, then I change the device to under android 9, in my case I use Android 6 it’s working

I’ve been having this issue as well. Searching high and low for an answer. Disabling my ad-blocker gave me more feedback in the console for some reason. And then I noticed chrome was debugging the main thread. Easy to overlook.

Aantekening 2020-06-27 202124

After clicking the debuggerWorker thread, the app started registering and hitting breakpoints… I hope this helps some of you out 👍

This was the only solution out of every single thread I’ve read related to this issue that’s worked for me.

Days…DAYS…

Thank you @Selman555 🙂

For anyone that is still stuck on this, checking “Disable cache (while DevTools is open)” in the console settings usually fixes it.

image

It works for me

same issue. stuck for a few hours now

When this is happening, I can no longer input text into text fields, as the keyboard doesn’t appear. The debugger becomes unusable, not being able to login into the application.

Hi guys! For me, worked clearing my Google Chrome cache and clearing cache Simulator IOS: Device -> Erase all Content and Settings

I hope I’ve helped anyone.

I got this issue because I was using Icon.getImageSourceSync from react-native-vector-icons.

  • I am on Windows 10, running on an android emulator (genymotion).
  • I removed node_modules, ran yarn install.
  • Still getting:
Error: Unable to resolve module `./debugger-ui/debuggerWorker.cff11639` from ``:

None of these files exist:
  * debugger-ui\debuggerWorker.cff11639(.native|.native.js|.js|.native.json|.json|.native.ts|.ts|.native.tsx|.tsx)
  * debugger-ui\debuggerWorker.cff11639\index(.native|.native.js|.js|.native.json|.json|.native.ts|.ts|.native.tsx|.tsx)
  • Output from yarn list --pattern @react-native-community/cli:
yarn list v1.19.1
├─ @react-native-community/cli-debugger-ui@4.13.1
├─ @react-native-community/cli-hermes@4.13.0
├─ @react-native-community/cli-platform-android@4.13.0
├─ @react-native-community/cli-platform-ios@4.13.0
├─ @react-native-community/cli-server-api@4.13.0
│  └─ @react-native-community/cli-debugger-ui@4.9.0
├─ @react-native-community/cli-tools@4.13.0
├─ @react-native-community/cli-types@4.10.1
└─ @react-native-community/cli@4.13.0
   └─ @react-native-community/cli-debugger-ui@4.9.0


Also try clearing Metro bundler cache: expo start -c

Short term soultion should be to open debugger panel and clear cache. Screen Shot 2020-11-16 at 19 10 19

This issue comes up randomly for me, and when it does, it does not want to go away. BUT this just worked for me. Although a little time consuming, I’ll be doing this from now on as a worst case scenario:

  1. Close Chrome and Quit. Update chrome if needed.
  2. Close the app on iPhone
  3. Stop & close Xcode
  4. Delete the app from my phone
  5. Run npx react-native clean-project to (I tell it to wipe node_modules, pods, clean build folders, and clean cache)
  6. Restart my Macbook

Obviously if you’re running on simulator you’ll have to adjust the process slightly.

I had same problem with following version “react”: “16.11.0”, “react-native”: “0.62.2”,

Below step work for me

Try this:

  • Stop application if running
  • Close remote debug tab
  • run again

same problem

Edit: i stopped remote debugging in expo client and it worked

I solved my problem:

in package.json

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

delete yarn.lock and run yarn install.

To come back on my previous post. After 2 weeks of searching I found the solution regarding the missed onPress() events when de remote debugger is active. This followed from a few seconds of timing difference between my phone and laptop. Disabling auto disabling automatic time resolution on my phone and manually setting the time on my phone back a minute solved this problem for me. Credits for pointing in the right direction to: https://github.com/facebook/react-native/issues/27008#issuecomment-592048282

But the same Error: Unable to resolve module remains when activating the remote debugger. Which results in the phone being unable to auto refresh after changes been saved in the code. After the first update you get the Refreshing... message on the phone. The refresh doesn’t happen, no additional error/warning printed in the console. After following updates the message is not printed on the phone anymore. However, I get the console logs printed.

The weird thing is that my colleague has pretty much the same Arch Linux + ThinkPad set-up. On his devices the problem doesn’t occur. We invested many many hours in attempting to locate the problem, without results. So, for now I just manually reload the app from the terminal after every save when the debugger is activated. Which of course has a severe impact on productivity.

$ react-native --version 4.8.0 (installed with yarn, but also tried npm)

@zenkhas Yes, at least for me on an emulator it functions properly even without adjusting the date and time but there are certain cases where using a physical device for development purposes is crucial.

So far I’ve tried meddling with the node modules, deleting all types of caches (including the browser’s… every browser’s tbh so we can rule out the issue being browser-specific), adjusting the date and time, ruling out possible browser extensions that might be messing with the debugging process, swapping debugger threads and so on… 😕

FYI for what it’s worth I use Windows 10 and Chrome (Android development v0.62.2)

It is happening everytime I switch from debugging from bash to chrome, while it’s showing the logs in metro bundler, and I click debug in the rn menu

edit: it’s basically forcing us to use the metro bundler, and not chrome to debug. When I set the app from the menu to debug mode, when javascript logs are going to the browser console, I receive this error

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

None of these files exist:
  * debugger-ui/debuggerWorker.cff11639.js(.native|.native.js|.js|.native.json|.json|.native.ts|.ts|.native.tsx|.tsx)
  * debugger-ui/debuggerWorker.cff11639.js/index(.native|.native.js|.js|.native.json|.json|.native.ts|.ts|.native.tsx|.tsx)
    at ModuleResolver.resolveDependency (/Users/henriquederosa/dev/myapp/node_modules/metro/src/node-haste/DependencyGraph/ModuleResolution.js:163:15)
    at ResolutionRequest.resolveDependency (/Users/henriquederosa/dev/myapp/node_modules/metro/src/node-haste/DependencyGraph/ResolutionRequest.js:52:18)
    at DependencyGraph.resolveDependency (/Users/henriquederosa/dev/myapp/node_modules/metro/src/node-haste/DependencyGraph.js:287:16)
    at /Users/henriquederosa/dev/myapp/node_modules/metro/src/lib/transformHelpers.js:267:42
    at Server.<anonymous> (/Users/henriquederosa/dev/myapp/node_modules/metro/src/Server.js:841:41)
    at Generator.next (<anonymous>)
    at asyncGeneratorStep (/Users/henriquederosa/dev/myapp/node_modules/metro/src/Server.js:99:24)
    at _next (/Users/henriquederosa/dev/myapp/node_modules/metro/src/Server.js:119:9

Yes, it’s exactly like this, I have uninstalled and install again but still same when debugging mode

@imamrobani Thanks for the link. But it doesn’t address the issue?

The issue may well be Chrome related. But it wasn’t there in earlier versions of React-Native.

I was using absolute path with module-resolver that was causing this issue removing that all error got clear from the console and debugging works without clearing cache and no need of doing any cleanup.

@shubhanus no, not really. I just made sure to not use the method when remote debugging. When I do remote debugging I just require a png directly.

In my case, the issue was Flipper. I commented out Flipper init from didFinishLaunchingWithOptions in AppDelegate.m and it works

#if DEBUG
    InitializeFlipper(application);
#endif

@thymikee

@rahamin1 have you tried @satya164’s instructions? #28844 (comment) and #28844 (comment)

Tried now. Didn’t help.

@fredrivett - hi there! i work on expo and so does @satya164, who fixed the issue. we’re hoping to have a release backported to older rn-cli versions, but i’m not sure what timeline there is for that on the rn-cli side of things. @thymikee may be able to answer that better.

same issue with “react-native”: “0.62.2” it disappears if i press cmd+R two times fast, but the next reload throws an error again

Crashe the debugger-ui/ EXPO-CLI React-native expo SDK 39 DevTools failed to load SourceMap: Could not load content for http://localhost:19001/debugger-ui/ui.bcd3f9d1.js.map: HTTP error: status code 500, net::ERR_HTTP_RESPONSE_CODE_FAILURE

I have resolve this by React Native Debug “Stop Debugging” and “Debug”

I run RN 0.63.2 on macOS 10.15.6 with IOS emulator. And I struggle with that error for at least 6 months in a row. Here is what helps me every time I get stack:

1. Restart your mac 2. $ react-native start --reset-cache 3. Run app from the XCode

Tips:

  • once you miss to run “react-native start --reset-cache” and started your project from XCode without it, you may catch “Unable to resolve module” and the only what can help you is a Holy System Restart)
  • every time development is finished I do: cmd+C on terminal, cmd+Q on emulator, then Stop (cmd+.) on XCode, close debugger tab in Chrome

Hope that workaround will help someone! GL

After that I go to the church and put some candles on, draw some pentograms, and dance with a tambourine for 2-3 hours. 😃 😃 😃 I solved it by stop using this debugger and start using react native debugger application.

I run RN 0.63.2 on macOS 10.15.6 with IOS emulator. And I struggle with that error for at least 6 months in a row. Here is what helps me every time I get stack:

1. Restart your mac 2. $ react-native start --reset-cache 3. Run app from the XCode

Tips:

  • once you miss to run “react-native start --reset-cache” and started your project from XCode without it, you may catch “Unable to resolve module” and the only what can help you is a Holy System Restart)
  • every time development is finished I do: cmd+C on terminal, cmd+Q on emulator, then Stop (cmd+.) on XCode, close debugger tab in Chrome

Hope that workaround will help someone! GL

Same error here.

It’s definitely an error relative to sourcemaps. When you try to fetch the url for the sourcemaps it will dump that error. If you disable sourcemaps for both js and css in devtools settings, it won’t show any more errors. I’d say that it’s either not generating or not serving them?

Anyone knows why could that be? In my case it’s happening in Windows

The solution is to make the Date and Time of your machine (in case of iOS) and Emulator (in case of Android). I’m getting this same error, and in console it says **Debugger and device times have drifted by more than 60s. Please correct this by running adb shell "date date +%m%d%H%M%Y.%S" on your debugger machine.**

After updating the Date and Time of emulator it works.