react-native: [Workarounds] Packager unable to resolve module from /Users/node_modules/

I suspect that this is actually an npm bug. It seems that npm is secretly deleting installed packages in my project’s node_modules directory, when I install an unrelated package. When it blows up with an error, it references /Users/node_modules/ because (I’m guessing) it’s just searching up the directory tree 3-4 levels before giving up.

re-running npm install <module> —save for each of the missing modules fixes this issue for me.

edit: My guess is that React Native’s complex dependency structure is just exposing npm’s bugs.

edit 2: Yeah, you pretty much want to blow away your project’s node_modules directory and do a fresh npm install. I think the issue is extra common if you depend on modules that React Native also depends on (say, lodash). npm just gets into a weird state with all the, ahem, flux 😃.

I started learning React Native today and I want to quit already 😄

I’ve struggled with this for so long now. With my experience, I think we should consider changing the info message from:

This might be related to https://github.com/facebook/react-native/issues/4968 To resolve try the following :

1. Clear watchman watches
2. Delete the node_modules folder
3. Reset packager cache

To:

This might be related to https://github.com/facebook/react-native/issues/4968 To resolve try the following:

1. Bang your head against the wall repeatedly

Of all the dumb sh!t I’ve dealt with as a programmer, this one takes the cake. Really want to be able to use RN, but I can’t get a damn project going after installing a few packages??? What the hell is going on?

OMG… i can’t believe how this actually solved mine, because after trying all the stuff people suggested here i couldn’t make it work. Did prolly 10~ rm -rf node_modules && npm install, then cleaning packager cache, running react-native-git-upgrade, restarted my mac 2 times, i didn’t even know what was going on, until i saw a post in stackoverflow saying to “install react to latest version”… i said, how? i already got “react”: “^16.0.0-alpha.6”, on my package.json, so that shouldn’t be the case… i checked just in case my last npm install… and it was effectively complaining about react not being installed for my react-native… HOW DA ***** that happened? i spent 2 hours trying to figure this out. How was node not installing react if it was in the package.json? is this some kind of existing bug?

So if you still have this problem, check on that.

And just simply do:

npm install --save react@16.0.0-alpha.6

On your project root.

Until we find the root cause for this it would be great showing a better error message with possible ways to fix the problem. For instance:

• watchman watch-del-all
• npm cache clean && npm install

Someone wants to send a PR for this? 😉

This thread is almost a year old and still seems to be a problem consistently. Clearly there is something much bigger going on.

What is the status on identifying the root cause(s) of this issue?

@alvaromb find node_modules/ -type f -name .babelrc | grep -v packager | xargs rm # Removes all .babelrcs from node_modules is your friend

I am wondering why facebook has not resolved this problem since 2015…

For those of you who encountered this error after upgrading to 0.21.0 or 0.22.0-rc, you will notice when you run react-native upgrade that react is now a peer dependency of react-native, therefore you must install react yourself. npm install react --save solved the “Unable to resolve module LinkedStateMixin” error for me.

єто пиздец пацаньі 😦

I banged my head against a wall for the last 15 minutes before finding this thread. I had added a new npm library (react-native-i18n) and when I did a new build, it was throwing the same error message “Unable to resolve module react-native-i18n from /Users/node_modules”. I resolved this by killing the react-native/packager script terminal window. Thanks for having this thread!

react-native 0.17.0 npm -v 2.14.15 node -v v5.3.0

Remember that getting this issue can have a variety of reasons, but if you have upgraded to 0.22.0-rc4 or similar, downgrading to 0.21 will most likely work for you:

npm install react-native@0.21.0 --save
watchman watch-del-all

This issue creeps me out. i loose hope in react native… 😐

👍 I’m seeing this too with npm 2.14.15 and node v5.1.0. I eventually got a fix by following @sgonyea’s advice – blew away the react-native npm module and reinstalled.

Interestingly none of:

• watchman watch-del-all
• rm -rf $TMPDIR/react-packager-*

fixed it for me. I experienced this after switching between two different React Native projects (one that relies on an older version). I ran the packager for both so maybe that will be part of the repro? It’s not clear.

Either way I’m unblocked but this seems like a pretty nasty but. And googling for it yields a bunch of unrelated issues 😛

I just ran into it as well, make sure that you have react 15.0.2 installed. If you have "react": "^15.0.2" in your package.json it will install React 15.1.0 which is not supported by RN 0.26.1. So use "react": "15.0.2"

Edit:

if after that you get any errors similar to createClass is not a function, that most likely means that either somewhere in your code you try to import (require) React from react-native OR one of the libraries you use is not updated and still does the above. As of React Native 0.26.x you must import React from 'react' not 'react-native'

For anyone having this issue on a mac - this is my go to fix: https://github.com/GantMan/mobile-commander/blob/master/bin/newclear.sh

I encountered the same issue. I have run all the commands as @satya164 posted but it didn’t work.

I resolved the error by running

node_modules/react-native/scripts/packager.sh --reset-cache 

NOT rm -rf $TMPDIR/react-*

Some path related values might have been modified, i think.

npm cache clean && npm install fixed my project.

I encountered this bug after upgrading React Native from 0.14 to 0.17. After the upgrade I installed a new module (react-native-swipeout) and tried to require it in my code but the module could not be located. At this point I also tried to require a new JS file I had created. That did not work either.

I’m using nvm 0.29.0, Node.js 5.3.0, and npm 3.3.12.

Edit: After the first time the problem disappeared I added another module (rn-router) and the same happened again. I got it working again when I closed the emulator and the packager script, and then ran clean & build in Xcode.

Guys, I’m watching this waiting for a solution, can you start a slack or something to discuss comment length.

Github needs threads

this may be because of the metro cache, so you can add below func in your zshrc (bash_profile?)

# react-native
function rn-clean() {
  watchman watch-del-all
  rm -rf $TMPDIR/react-*
  rm -rf $TMPDIR/haste-*
  rm -rf $TMPDIR/metro-*
  npm start -- --reset-cache
}

Using npm start -- --reset-cache suggested by @mentalMedley fixed it for me. Hopefully stays fixed.

After upgrading my project to RN 0.31, the most annoying bug - 4968 came back. Again, I have removed all of the node modules, cleared watchman and ran package reset. I have done a clean clone, purged everything I could. It’s still happening. What makes it more weird is that it’s react native that cannot resolve itself :

Unable to resolve module react/lib/ReactNative from [path to node_modules] /node_modules/react-native/Libraries/react-native/react-native.js

Not sure if it’s the upgrade failing. Any ideas?

I am upgrading our app from 0.14.0 to 0.20.0 (been too busy to upgrade), and we are having this issue as well. None of the “workarounds” have worked…at all. FWIW, I also tried upgrading to 0.21.0-rc and it still gives the same error. Here is a screenshot of the error we get (the same as everyone else, just the PanResponder for us): http://cl.ly/2B3b3P0L2W00

I have seen some say that recreating the RN project may work, but will that really work? Our app has a lot of 3rd party Libraries, Pods, Frameworks, Bundle Resources, Custom Build Phases, and Assets. That is on top of making sure all of our Code Signing, Linking, Packaging, Search Paths, Info.plist, etc. are all setup correctly. Doing all of this work without knowing if it will actually fix the issue is out of the question.

This issue has been open for 2 months, and I see little or no feedback that this is even being looked at. It has the label of “Good First Task”, which seems to imply this is a simple thing. However, if it is so simple, then why hasn’t anyone proposed a practical solution or Pull Request? I would happily hop in there and try to fix the issue, but I honestly have no idea where to even begin (I really have no idea why this is labelled as “Good First Task”)

Having a huge, app-breaking, issues like this sitting open 2 months with people just saying “me too” does nothing but hurt the project’s reputation, and piss people off.

Sorry if I sound impatient or “like a dick”, but instead of finding an actual solution, the error message was updated to include instructions on how to work around the issue, which is obviously not working for everyone.

/rant

FWIW, this error message is just the symptom of the packager not being able to find some-module. It’ll walk up the directory tree until it finds node_modules/some-module. It just so happens that /Users is the last directory to try, hence the weird /Users/node_modules directory in the error message.

This is a disaster for our team. The only way to get past this is to go nuclear and create a whole new project. I still don’t understand how nobody has found a concrete answer after all this time.

ctrl+c, then npm run start or react-native start, you can also do react-native start --clear-cache, then if you restart your app on your Android emulator or iOS simulator, it will re-bundle.

After taking a 6 month break from RN I started a new project to see if this issue is resolved, nope just a big BOOM

I can’t believe RN is so popular when such a fundamental thing is still broken

rm -fr $TMPDIR/react-* and npm start -- --reset-cache are not same. In my case first command didn’t help me but second did.

Some new information that may be helpful to others. Like many above I tried everything in this thread, and nothing fixed it.

The language of the following error can be somewhat misleading, and perhaps even incorrect (I don’t understand what the qualifications for inclusion in the module map are so I can’t be certain which of the above it is):

Unable to resolve module $MODULE from $FILE: Module does not exist in the module map or in these directories: $DIRECTORIES

In my particular situation, I was importing node-hue-api into my react-native project. node-hue-api depends on dgram, amongst other packages. Since dgram is included with node, node-hue-api does not have it explicitly listed as a dependency in its package.json. So, I ran the following:

npm install dgram --save

Now, the module actually existed in one of the listed directories, but I still got the exact same error.

After pulling my hair out for a few hours I looked into whether there may be a specific issue around using dgram with react-native, and it turns out there indeed is. One is supposed to use react-native-udp instead.

npm install react-native-udp --save

And I added the following section to my project-level package.json.

"browser": { "dgram": "react-native-udp" },

This still did not resolve the issue, and the error remained unchanged. Next I added the exact same section to ./node_modules/node-hue-api/package.json. This fixed the issue.

Now, I got the same error for timers, stream and buffer. There are all not used by node-hue-api directly, but they seem to be implicit dependencies of some other modules that node-hue-api depends on which did make their way into the project’s node_modules folder. I installed each of these with npm (one at a time, because they were revealed one at a time) and finally I was able to run my project.

Lessons for me that may be of value to others having similar issues:

1. When you get this error, first check if any of your imported node modules have dependencies that aren’t listed in their package.json, because they are assumed to be there.
2. If, after adding installing these missing dependencies manually, you still get the message, and after blasting the cache etc you still get it, research and find out if perhaps the module you are trying to import is incompatible with react-native, see if there is an alternative, and modify the packages that are dependent on the incompatible module to use the alternative instead.

Feedback for react-native contributors:

1. Assuming the module map excluded dgram deliberately because it’s a known incompatibility: this needs to be bubbled up to the developer at build/run time with a clear error message. e.g. “package blah could not be loaded, it cannot be used with react-native”.
2. Clean up the language of the above error message, by creating specific errors for the different sub-cases. It is very unclear what is happening now, with the message being identical for missing files as well as incompatibilities. Correctly parsing the error requires too deep an understanding of what the “module map” may be.
3. Explore a way to make the react-native alternative modules for things like dgram part of the standard react-native distro, and make them “just work”, or provide instructions on how to make them work to developers.
4. Explore a way to keep going when a modules is missing, so that perhaps an exhaustive list of current-level missing dependencies can be returned to the developer, and they don’t have to npm install blah --save one at a time until the final error goes away.

It is now 2017 and this is still not solved. Do we need to bring in the big guns, and have Lord Zuckerberg fix this himself? I do not think he would be very happy if he has to.

However, for people struggling. It took me downgrading my version of react and react native to the following in my package.json file,

"react": "15.3.2", "react-native": "0.35.0"

It didn’t take doing all of these crazy steps listed throughout this thread either. After I init’ed the react native app, I went into the package.json, changed those two things out, ran ‘npm install’, then installed axios, which was the module I was having trouble with. Everything works now.

@musghost

"react": "^15.3.2",
"react-native": "^0.35.0",

just ran

$npm install --save react
Version_2@0.0.1 /Users/douglaswalker/dev/Kompas/kompasapp-frontend/Kompas
└── UNMET PEER DEPENDENCY react@15.4.0

npm WARN react-native@0.35.0 requires a peer of react@~15.3.1 but none was installed.
npm ERR! code 1

upgraded R & RN, still getting the error 😦

Okay, so I needed to npm install React-Native v0.36.1 with React v15.3.1 👍

Thanks! @musghost

Solved!

I performed:

• Delete the node_modules folder -rm -rf node_modules
• rm -fr $TMPDIR/react-*
• watchman watch-del-all
• yarn cache clean
• yarn
• Recreate the project from scratch But:

I have had this problem and tried all kinds of stuff with removing node_modules folder and changing version numbers. What helped was this single command: npm run start -- --reset-cache

I hope this helps. Credit goes to @AlanFoster https://github.com/tleunen/babel-plugin-module-resolver/issues/29#issuecomment-293677279

Just thought I’d let you all know that I found on the wiki that there’s a planned update to the packager coming soon:

https://github.com/facebook/react-native/wiki/Roadmap

https://mobile.twitter.com/cpojer is reponsible. We can but hope this issue will be addressed then.

so tempted to hit the unsubscribe button

I vote that the error message be fixed to better help us figure out the issue. I think a lot of these issues are related to typos in the code that result in the packager not recognizing certain modules.

This worked for me.

(Exit Xcode and all open terminals)
rm -rf node_modules
rm -rf $TMPDIR/react-* --reset-cache
rm -rf node_modules/react-native/packager/packager.sh --reset-cache
npm cache clean
npm i

react-native 0.21.0 is ok, but 0.22.0-rc has this problem again.

What worked for me is

1. in terminal go to project/node_modules/react-native
2. run npm start from here
3. try now

I had this a few times and unfortunately @29er’s fix didn’t seem to work for me. I am referring to this fix: watchman watch-del-all npm cache clean && npm install

What did seem to fix it (after killing the emulator and npm packager script) was deleting the node_modules folder and running the basic app init commands:

1. react-native init AwesomeProject
2. npm install

Running react-native init again won’t destroy your project 😃 It will prompt you if you want to override the react-native generated files.

@jang0509’s solution fixed it for me (on Mac) when the usual solutions above failed. (Then it happened again later, only with AccesibilityInfo, per https://github.com/facebook/react-native/issues/14209.

Then I switched to a fresh new project with Yarn. Then it started happening again. Then somehow I fixed it by messing around with yarn. Hoping Mark Zuckerberg will be able to devote some of his resources to making things a bit smoother.

Looks like 0.45.1 fixes this (see #14412)

I’ll get the party hats ready.

We had the same problem and tried all of the solutions from above but nothing worked. Colleague unexpectedly solved it by downgrading the native-base version from 2.1.1 to 2.0.12 and we locked it right there.

We use it with react@15.4.2 and react-native@0.42.0.

I also had this problem after updating react-native to 0.34.1 Solved it after

• Delete the node_modules folder: rm -rf node_modules
• Reset packager cache: rm -rf $TMPDIR/react-* --reset-cache or rm -rf node_modules/react-native/packager/packager.sh --reset-cache
• npm cache clean
• Killing the packager terminal and all open emulators
• npm install

Update: For those who couldn’t resolve the issue with this approach: It seems the packer uses port 8081. So before doing all the steps ensure that no other service is running on 8081: lsof -n -i4TCP:8081 and then kill it with the PID.

After all including react-native-camera component it worked only when started via xCode…

@DominicTobias Here is an alternate to symlinks that can help with component development: https://github.com/wix/wml

1. update npm to 3
2. npm install react --save-dev

This solve my problem.

I have the same problem with ‘react-native-maps’, whatever I try the build fails with this message that the module cannot be found.

What solved the issue for me:

@TamilanDawwEenalum#8093 yeah that was weird. I ended up just doing a:

rm -rf yarn.lock
rm -rf package-lock.json
yarn cache clean
rm -rf node_modules
watchman watch-del-all
yarn start 

package.json

{
	"name": "manager",
	"version": "0.0.1",
	"private": true,
	"scripts": {
		"clean": "rm -rf node_modules && npm i && watchman watch-del-all && rm -fr $TMPDIR/react-* && rm -rf ios/build/ModuleCache/* && rm -rf ios/buildn",
		"ios": "react-native run-ios",
		"start": "react-native start",
		"test": "jest",
		"flow": "flow",
		"flow:status": "flow status",
		"flow:ls": "flow ls",
		"flow:stop": "yarn run flow stop"
	},
	"dependencies": {
		"firebase": "^4.6.2",
		"react": "16.0.0",
		"react-native": "0.50.3",
		"react-native-router-flux": "^4.0.0-beta.24",
		"react-redux": "^5.0.6",
		"redux": "^3.7.2",
		"redux-thunk": "^2.2.0"
	},
	"devDependencies": {
		"babel-jest": "21.2.0",
		"babel-preset-react-native": "4.0.0",
		"flow-bin": "0.56.0",
		"jest": "21.2.1",
		"react-test-renderer": "16.0.0"
	},
	"jest": {
		"preset": "react-native"
	}
}

babel

{
  "presets": ["react-native"]
}

The problem can still persist if you delete the project and recreate it in the same directory with the name that it had before. The way around it is to find the module/modules that are causing the issue; uninstall and unlink them with the following commands: npm uninstall <module-name> npm unlink <module-name> The above commands always fix it for me on Windows.

Forgive my English is not good, the error message said: node_modules \ react-native \ node_modules \ react \ lib The I was in the previous project which copy the lib folder into it can be run. Copy lib, copy lib The In the old works inside. I hope everyone has to help.

@msqar Thank you. 😆😵

@gorangajic is haul going to be the packager to ship with RN in future?

If you are coming here because your create-react-native-app sent you this issue url when trying to use the EXPO SDK:

you have to use import { Components } from 'expo'; instead of import { Components } from 'exponent'; as stated in their docs.

I ran into this, and only doing:

kill <pid of packager>
./node_modules/react-native/packager/packager.sh --reset-cache

and reloading JS in simulator worked for me.

I had the same issue, after I changed the versions to below ones everything worked again : react-native: 0.35.0 react: 15.3.2

I solved it by removing all ~ and ^ symbols from my package.json so all dependencies have explicit versions. And then ran:

npm cache clean && watchman watch-del-all && rm -rf node_modules && npm install && npm start -- --reset-cache 

@mtford90: Did you install React as well as @gnestor mentions above? It’s now a peerDependency so you have to manually install it (if upgrading). I was having the LinkedStateMixin problem as well and that fixed it. (As well as clearing all caches and restarting the packager)

In the end, this worked for me.

Environment:
  OS: macOS High Sierra 10.13.4
  Node: 9.11.1
  Yarn: 1.6.0
  npm: 5.6.0
  Watchman: 4.7.0
  Xcode: Xcode 9.3 Build version 9E145
  Android Studio: Not Found

Packages: (wanted => installed)
  react: 16.3.1 => 16.3.1
  react-native: 0.54.2 => 0.54.2

Ejected create-react-native-app with typescript using (“react-native-typescript-transformer”)

#!/bin/bash

# Clean xcode generated crap
rm -rf ios/YOUR_PROJECT.xcodeproj/xcuserdata/

# Clean build
rm -rf ios/build/

# Remove relevant react-native cache files
rm -rf $TMPDIR/metro-*
rm -rf $TMPDIR/haste-*
rm -rf $TMPDIR/react-*

# sanity!
rm -rf node_modules

I just reinstalled my project from remote Git and am suddenly a victim of this issue.

Unable to resolve module `redux` from `/Users/wbattel4607/Desktop/project/node_modules/react-redux/lib/connect/mapDispatchToProps.js`: Module `redux` does not exist in the Haste module map
This might be related to https://github.com/facebook/react-native/issues/4968
To resolve try the following:
  1. Clear watchman watches: `watchman watch-del-all`.
  2. Delete the `node_modules` folder: `rm -rf node_modules && npm install`.
  3. Reset Metro Bundler cache: `rm -rf /tmp/metro-bundler-cache-*` or `npm start -- --reset-cache`.
  4. Remove haste cache: `rm -rf /tmp/haste-map-react-native-packager-*`.
+ [[ false != true ]]
+ [[ ! -f /Users/wbattel4607/Library/Developer/Xcode/DerivedData/myapp-cvscqhbhrcowbrfzfirwmdiuyvfc/Build/Products/Release-iphoneos/myapp.app/main.jsbundle ]]
+ echo 'error: File /Users/wbattel4607/Library/Developer/Xcode/DerivedData/myapp-cvscqhbhrcowbrfzfirwmdiuyvfc/Build/Products/Release-iphoneos/myapp.app/main.jsbundle does not exist. This must be a bug with'
+ echo 'React Native, please report it here: https://github.com/facebook/react-native/issues'
+ exit 2

We do not, nor ever have used redux. Nothing in our project changed between when it was working and when it was not. None of the proposed solutions work for us. I’ve reset the cache, restarted my computer, reinstalled node_modules with both NPM and Yarn, etc… I’ve been at this for hours and don’t have anything left to try.

Environment:
  OS: macOS High Sierra 10.13.4
  Node: 6.10.3
  Yarn: 1.6.0
  npm: 5.6.0
  Watchman: 4.9.0
  Xcode: Xcode 9.3 Build version 9E145
  Android Studio: 3.0 AI-171.4408382

Packages: (wanted => installed)
  react: 16.3.1 => 16.3.1
  react-native: 0.55.3 => 0.55.3

How is this still an issue 3 years later?

everything in the top seemed to not work for me.

I tried everything of the mentioned solutions, nothing worked. For me it happened when I installed Redux with npm install --save react-redux. Everything worked fine until I installed redux. I installed it in the project folder, but get the error message: “Unable to resolve module ‘redux’ from…”

tl;dr;

Install babel-preset-react-native and add it to your babelrc presets:

1. Install the latest from create-react-native-app
2. npm run eject
3. npm i --save-dev babel-preset-react-native
4. Edit your babelrc file presets hash to include “react-native” just before the default “babel-preset-react-native-stage-0/decorator-support”.

Versions:

• Mac OSX Sierra
• Node v.8.6

Detailed Solution

I spent many days battling this issue. I attempted virtually every recommendation in this thread (and every combination of solutions) and none of them worked.

Here’s a quick list of non-working solutions:

• reverting versions of react/react-native vs. using newest versions
• checking for version compatibility on every npm package
• deleting package-lock.json
• various cache clearing recommendaitons
• watchman clears
• uninstalling/reinstalling/updating watchman
• installing/running yarn vs npm
• removing all unnecessary plugins
• removing ios/build folder
• using babel-plugin-module-resolver vs. babel-plugin-module-alias
• using various techniques of syntax withing babelrc for module-resolver vs. module-alias
• etc

Solution Add and configure the “babel-preset-react-native” npm package.

This leads me to believe that the default “babel-preset-react-native-stage-0/decorator-support” preset is insufficient. Does this seem likely to anyone who’s a little more familiar with presets?

See my full (barebones) project architecture and configs (.babelrc and package.json) below:

Project directory structure:

android/
ios/
node_modules/
src/
.babelrc
package.json

.babelrc

{
  "presets": [
    "react-native",
    "babel-preset-react-native-stage-0/decorator-support"
  ],
  "env": {
    "development": {
      "plugins": [
        "transform-react-jsx-source"
      ]
    }
  },
  "plugins": [
    [
      "module-resolver", {
        "cwd": "babelrc",
        "root": "./src" // note, this is the directory for my app, for you this may be something different
      }
    ]
  ]
}

package.json

{
  "name": "app",
  "version": "0.1.0",
  "private": true,
  "devDependencies": {
    "babel-plugin-module-resolver": "^3.0.0",
    "babel-preset-react-native": "^4.0.0",
    "babel-preset-react-native-stage-0": "^1.0.1",
    "jest-expo": "^22.0.0",
    "react-test-renderer": "16.0.0-beta.5"
  },
  "scripts": {
    "start": "react-native start",
    "android": "react-native run-android",
    "ios": "react-native run-ios",
    "test": "node node_modules/jest/bin/jest.js --watch",
    "clean": "rm -rf node_modules && npm i && watchman watch-del-all && rm -fr $TMPDIR/react-* && rm -rf ios/build/ModuleCache/* && rm -rf ios/build"
  },
  "jest": {
    "preset": "jest-expo"
  },
  "dependencies": {
    "react": "16.0.0-beta.5",
    "react-native": "^0.49.5"
  }
}

package	version
react	16.0.0
react-native	0.50.3
npm	5.5.1
node	8.4.0
host os	macOS
offending package:	react-native-dotenv

I tried all the yarn and cache clearing suggestions here, thank you all for those, and none worked for me. I had to remove the package that the error was pointing to from my project all together.

1. react-native uninstall [package name]
2. rm -rf node_modules
3. Delete the package from your package.json
4. Delete package-lock.json
5. npm install
6. react-native link
7. npm start -- --reset-cache
8. react-native run-ios or react-native run-android

Of course this requires you can’t use package X so not much of a solutions just help to get someone over the hump. This issue helped me figure it out: https://github.com/zetachang/react-native-dotenv/issues/31

For me using yarn solved all my problems!

How Can I fix This?

1. Clear watchman watches: watchman watch-del-all.
2. Delete the node_modules folder: rm -rf node_modules && npm install.
3. Reset packager cache: rm -fr $TMPDIR/react-* or `npm start – --reset-cache After These 3 steps I got This Error:

Solved ✔️ I removed watchman Files From my Project Path.

same issue again and this time its not solving .tried everything

Looks like 0.45.1 fixes this (see #14412)

Upgrading to 0.45.1 also fixed this for me.

@msqar

You are the real MVP. Saved me from scrapping my project.

Any idea why that works?

I reboot osx, and it works now.

I had the same problem with socket.io-client package. I tried every solutions above, including the command npm run newclear, but no results. So I tried to downgrade the package from 1.7 to 1.5, running npm install socket.io-client@1.5, and I finally got it.

If your “Unable to resolve module” error mentions core node packages, give rn-nodeify a try. It worked for me, following C.Lee’s answer here.

npm install rn-nodeify

Then in package.json “scripts” section:

"postinstall": "node_modules/.bin/rn-nodeify --install http,https,url,zlib,_stream_transform,assert --hack"

Your specific packages will vary. My error first showed “Unable to resolve module url”, so used just that after the --install flag, ran ‘npm run postinstall’ (or cleared cache like @alnorris mentioned above), and got the same error for http, etc. Kept adding packages until no errors. Didn’t need a restart.

Using:

react-native: 0.39.2
react: 15.4.1

Hopefully Facebook can provide a better solution.

I have the exact same issue. None of the above mentioned solutions seems to work. I’m trying to import the ‘sjcl’ module for encrypting.

LOL, just noticed I got 3 thumbs down for sharing my solution of how I clear cache… Ummm ok. I guess I’ll just keep my solution to myself then?

any news fixes for this problem!?!

@DominicTobias :||| how solve this problem? Im very searched but cant find any answer…

Hi guys,

After upgrading npm/node/react-native/react to its latest:

react-native: ^0.29.0
react: 15.2.1
npm: 3.10.3
node: 6.3.0

Then:

watchman watch-del-all
npm start -- --reset-cache

This issue went gone : )

Hope this helps.

Anyone who’s upgraded to 0.27*, make sure you have react 15.1.0 installed.

I upgrade npm to latest version (3.9.3) and everything work like a charm !!!

• sudo npm install npm -g
• watchman watch-del-all
• npm cache clean && npm install DONE…

It happens when I use some.jsx as module name, when I change to some.js,it work.I don’t know why…

I’m getting the Unable to resolve module LinkedStateMixin on > 0.21.0. I’ve tried every suggestion in this thread and nothing has helped so I’ve just resorted to downgrading for now. Which sucks because I’d love hot reload!

I had this issue. The problem was no projectRoots had node_modules in it.

I changed this:

{
  "scripts": {
    "start": "node node_modules/react-native/local-cli/cli.js start --projectRoots $PWD/Octoly/ReactComponent"
  }
}

To this:

{
  "scripts": {
    "start": "node node_modules/react-native/local-cli/cli.js start --projectRoots $PWD,$PWD/Octoly/ReactComponent"
  }
}

Ensure at least one of the directories listed by react-native-cli contains node_modules.

❯ npm start

> octoly-ios@1.0.0 start /Users/adrien/code/octoly-ios
> node node_modules/react-native/local-cli/cli.js start --projectRoots $PWD,$PWD/Octoly/ReactComponent

 ┌────────────────────────────────────────────────────────────────────────────┐
 │  Running packager on port 8081.                                            │
 │                                                                            │
 │  Keep this packager running while developing on any JS projects. Feel      │
 │  free to close this tab and run your own packager instance if you          │
 │  prefer.                                                                   │
 │                                                                            │
 │  https://github.com/facebook/react-native                                  │
 │                                                                            │
 └────────────────────────────────────────────────────────────────────────────┘
Looking for JS files in
   /Users/adrien/code/octoly-ios
   /Users/adrien/code/octoly-ios/Octoly/ReactComponent

hai iam using react-native version 0.21, When i try to install react-native-side-menu, I got like this in terminal ENOENT: no such file or directory, open ‘/Users/stlmini-1221/package.json’, in my simulator it shows like this when i checked in node-modules there is no react-native-side-menu module is there, can one tell me that what is the problem and how to resolve it

This problem was introduced with this commit: https://github.com/facebook/react-native/commit/793c3564ffb0c2b66abae0a5aa7997e2a9e4869c

I’m not sure this is the correct solution as it’s breaking a lot of third party libraries. Also, it’s only enabled for iOS :\

For now to fix 0.19.0 I’ve changed

react-native/packager/react-packager/src/Resolver/index.js:98

-shouldThrowOnUnresolvedErrors: (_, platform) => platform === 'ios',
+shouldThrowOnUnresolvedErrors: (_, platform) => { return false; },

Maybe @martinbigio can give some more insight on a proper solution?

I tried everything on this thread and stuck 😞 Are there any other workaround? Is someone working on it?

I’ve just upgraded from v0.15 to v0.19 to get all the new features which resulted in upgrading npm2 to npm3 and upgrading a lot of other dependencies. Fixed most issues but stuck on this one, help is appreciated.

Same issue on import { Provider } from 'react-redux/native'

Similarly to @btsai, restarting packager fixed the problem for me. Is adding modules while packager is running supported?

I think the module resolution is working properly, i.e. first node_modules from project directory is checked and then after unsuccessful match (probably due to packager not noticing the change), the resolver goes up the file system hierarchy, up to /Users/node_modules/<module> and fails with the last error message, which will be Unable to resolve module <module> from /Users/node_modules/<module>

I’ve looked at react-native/packager/react-packager/src/DependencyResolver/DependencyGraph/ResolutionRequest.js which I believe is the culprit here, but it would be good if someone more knowledgeable looked at it as well.

Everything was working perfectly well too ! And suddenly, this one showed up, without any reasons. I mean “WTF React Native !” ! These kind of issues are very a pain !

---

EDIT : Tried deleting cache, killed packager, restarted, shuted down my computer and restarted it, deleting node_modules and npm install again…

== > Nothing worked \o/

@shirakaba Always use ./ for relative paths, because doing require("img/image.png") will first look into your node modules by default (and then maybe in your relative files, unsure), while require("./img/image.png") look relatively to the file.

In an Expo app written in TypeScript, on a Mac, I found that I wasn’t able to require any image assets – npm modules were importing fine, however. I followed the steps in the top comment, and all the other 600 comments, but to no avail. I did get it working in the end, however – although I’m not completely sure how. Here’s a general health check:

• Simply restart your computer. This may clear other caches that have been missed by the suggested cache-clearing steps in this thread.

• If you’re writing a relative path like, require("img/image.png"), try putting an explicit ./ in front, e.g.: require("img/image.png"). Whether this tells the packager(?) to look for the image again via an uncached path, or whether adding ./ really is functionally different, I don’t know. This step may just be superstition.

• Check whether the path is actually correct, of course. In a TypeScript project, all module imports with non-relative names are assumed to be relative to the baseUrl configured in tsconfig.json (defaulting to the location of tsconfig.json itself). TypeScript module resolution docs here. Whether this applies to require() imports too, I don’t know.

• In the Expo client, reload the javascript bundle.

I haven’t said much here, and it surely won’t apply to most people, but hopefully this might help someone.

I’ve run into this issue too while building a React Native app. Is the only current solution to reinstall the node_modules and delete the caches? Doing this every time I implement a new module (maybe 3 or 4 times per day) massively slows down development.

@Benzer1406 rm -rf node_modules && npm i

Reinstall all modules, make sure you’re using the right node version, I got this error by mixing packages installed with 6.10 and 8.x

i tried all the suggested techniques but none seemed to work. finally just started to npm install all the modules it said was missing, installed 5-6 or so, and now i just get this:

tried a bunch to resolve that too, but can’t seem to be getting anywhere. incredibly frustrated.

My error was different below is the stacktrace.

error: bundling failed: UnableToResolveError: Unable to resolve module ieee754 from /Users/santanu/money/SecondAndroid/node_modules/buffer/index.js: Module does not exist in the module map or in these directories: /Users/santanu/money/SecondAndroid/node_modules

I did npm install ieee754 --save and the error is vanished.

Doing npm install instead of yarn install fixed the problems for me. I also deleted my node_modules folder before reinstall.

I was having same problem, I just changed the import from: import Teclado from 'teclado'; to import Teclado from './teclado'; I used procmon (on windows) to spy filesystem calls, it looked for the file on the current directory, as expected.

Nothing above worked for me… I’ve been fighting this issue for like 3 days and what actually worked for me was this:

1. I created a brand new project with: react-native init AwesomeProject
2. I copied the following entries from the fresh package.json over to my project:

	"dependencies": {
		"react": "16.0.0-alpha.12",
		"react-native": "0.48.1"
               ...
	},
	"devDependencies": {
		"babel-jest": "21.0.0",
		"babel-preset-react-native": "3.0.2",
		"jest": "21.0.1",
		"react-test-renderer": "16.0.0-alpha.12"
               ...
	},

1. I re-installed all modules with: rm -rf node_modules && npm i
2. I cleared all possible caches with: watchman watch-del-all && rm -fr $TMPDIR/react-* && rm -rf ios/build/ModuleCache/*
3. I had to upgrade a couple of other npm packages that I use, i.e. react-native-splash-screen.

AND IT FINALLY WORKED!

Apparently, react native is very sensitive to it’s node modules combination, so I figured if I can run a sample project, why I can’t run mine?!

Hope that helps.

Hit this today. I added the "module-resolver" plugin to .babelrc to rewrite some import names, and due to the dependency cache the changes were not taking place, and I was getting errors related to not being able to locate the modules.

In my case we had already modified the “start” script, so I manually ran:

node node_modules/react-native/local-cli/cli.js start --reset-cache

That fixed the issue.

This issue is still very much alive. I’ve spent the last 3+ hours combing through trying all of the solutions new and old, to no avail. This is fun though, the error changed once so now it’s less descriptive:

Loading dependency graph, done. error: bundling: Error at DependencyGraph._getAbsolutePath (C:/web/www/new/BeerClicker/node_modules/react-native/packager/src/node-haste/DependencyGraph.js:2 80:11) at DependencyGraph.getDependencies (C:/web/www/new/BeerClicker/node_modules/react-native/packager/src/node-haste/DependencyGraph.js:21 8:26) at Resolver.getDependencies (C:/web/www/new/BeerClicker/node_modules/react-native/packager/src/Resolver/index.js:107:27) at C:/web/www/new/BeerClicker/node_modules/react-native/packager/src/Bundler/index.js:591:37 ....

But my device now gets a 404 and says: Cannot find entry file index.android.js in any of the roots: ["myProjectRoot"] Although index.android.js is very clearly in my project root, as it has been, unchanged for days.

“react”: “16.0.0-alpha.12”, “react-native”: “0.45.1”, npm: 5.3.0 node: 8.1.4

Going to see how hard it is to port my code to a new project… ><

This was happening to me and I was able to resolve it.

My error was Unable to resolve module 'react-native/Libraries/Renderer/shims/ReactNativePropRegistry from /Users/<username>/<appName>/native-base/dist/src/Utils/computeProps.js, etc. None of the solutions above worked. I realized that my troubles happened after a fresh npm install and that everything had been working fine up until then. I checked and saw that in my package.json I had "native-base": "^2.1.5". I saw that native-base had bumped up to 2.3.0 2 days ago. In package.json I fixed my version of native-base to 2.1.5, deleted my node-modules and ran npm install and my problem resolved. I am able to consistently recreate this.

Might be worth a shot to make sure your issue isn’t stemming from your dependencies changing. Try fixing all your dependencies to the version you first installed them at, deleting your node-modules and npm installing.

Thank you for this thread! You all are the best!!

everything was working well until yesterday. I built my project from scratch and got this error. none of the solutions above fixes it.

react-native-cli: 2.0.1 react-native: 0.45.1

I encountered this bug after upgrading to “react-native”: “^0.45.1”, I’m using these versions

	"react": "^16.0.0-alpha.12",
	"react-native": "^0.45.1",
	"react-native-cli": "^2.0.1"

Have anyone any idea how to resolve this issue?

npm i buffer solve my problem

I tried all of the above methods, but no one worked out, then I rebooted my mac, all went ok again

I solved it by removing all ^ in package.json’s dependencies and devDependencies sections.

and run the following command

rm -rf node_modules
yarn                  # you may try npm install
npm start -- --reset-cache

Hope this helps.

After 3 hours of trying everything on this page … including building a new project, it worked finally with a mix of some steps, I’m leaving this here so someone will be able to make use of this step too and may be just maybe it will help them

Step 1 From android/build.graddle

allprojects {
    configurations.all {
      resolutionStrategy {
        eachDependency { DependencyResolveDetails details ->
          if (details.requested.group == 'com.facebook.react' && details.requested.name == 'react-native') {
            details.useVersion "0.44.2" // Your real React Native version here
          }
        }
      }
    }
}

Step 2 From package.json

"react": "16.0.0-alpha.6",
 "react-dom": "^15.4.1",
 "react-native": "0.44.2",

Step 3 could not get a normal install through so i gave in to the force npm install ---force

I honestly Wish this to help if all else fails… and i have not tested the side effects of this steps, yet

@atturnbull yea, i have no idea, it seems to be a bug related to npm packager maybe? looks like it’s not being able to recognize that you have that react module added in your package.json and it’s not installing it… even though you run through all that process of rm -rf /node_modules && npm install, etc, etc, etc… even cleaning packager cache doesn’t solve it. So, don’t know what might cause it. Thank God i found that in StackOverflow.

Glad to hear that it should be fixed soon, I’ll add in my 2-cents after this morning I faced the same issue; the way to fix for me, as dumb as it may sound, was to remove the node_modules folder and re-populate it with npm i instead of yarn (wasted 4 hrs before figuring out).

Took some time but in the end this one worked for me on a fresh project.

“react”: “16.0.0-alpha.6”, “react-native”: “0.43.3”, “react-navigation”: “git+https://github.com/react-community/react-navigation.git#7edd9a7”

141 comments so far:

this new packager https://github.com/callstack-io/haul should fix this issue

https://twitter.com/golenull/status/847713776283471872

🎊

Also running into this. Android app, Android Studio, latest node and NPM, installed a new module from our private NPM instance and started seeing this. Removing the import gets the code to compile.

I’ve tried all of the following in various combinations to no avail:

• clear watchman watches
• blow away node_modules
• npm clear cache
• npm start --reset-cache
• changing import statement to a require() (idk why, just seemed like worth trying)
• invalidate caches and restart Android Studio
• restart macbook
• restart macbook without reopening windows
• restart macbook with cmd+option+p+r to reset nvram
• full reset of both physical phone and simulator

EDIT:

• also tried importing directly from the file in node_modules (import MyThing from '../../node_modules/my-lib/src/MyThing.js'), no dice.

if anyone has any suggestions i’d be glad to hear.

@davidaurelio @mkonicek I believe I have tracked down a consistent repro case. Give the instructions here a shot: https://github.com/fadookie/react-native-issue-4968

For my case, I stop all node proccess and run :: 1.rm -rf node_modules && npm install 2.rm -fr $TMPDIR/react-* and then restart the xcode and start, it is OK

@alekseykarpenko Different issue, you have to include your own buffer module.

the fix for me was

• restart mac
• react init project
• git revert
• run ios

I’ve been able to avoid this issue by (whenever I’m about to install a new module) first quitting Simulator and terminating the server process. Once those are closed, them I can “npm install”, restart everything, and it’ll work fine.

Not sure if it will help others but I just did a bonehead thing that generated this error. I had an array of objects with image paths. One of the image paths was an empty string.

{text: ‘Done’, image: require(‘’)}

the image element gets passed into an Image source.

If you are getting this error on a class you wrote, check to see if you did something silly like me 😃

We experience this regularly. The nuclear option is to delete node_modules, reboot, then install and run. This appears to work every time and though it is a little ridiculous it’s sometimes better than faffing round with the other steps.

@JeroenNelen

$ react-native -v
react-native-cli: 1.2.0
react-native: 0.35.0`

package.json

"react": "~15.3.2",
"react-dom": "~15.2.0",
"react-native": "^0.35.0",

Anyone any clue on why the latest versions of react + react-native don’t seem to work? I’m getting the same issues as @douglaswissett when using the latest version of react in my react-native app.

@alnorris what version of react and react-native are you using?

same here with xml2json, here is packages.json:

	"dependencies": {
		"react": "15.4.1",
		"react-native": "0.38.0",
		"xml2json": "^0.10.0"
	},
	"devDependencies": {
		"babel-jest": "17.0.2",
		"babel-preset-react-native": "1.9.0",
		"jest": "17.0.3",
		"react-test-renderer": "15.4.1"
	},

Tailing on to this thread for search engine visitors (and for perhaps for future me), this appears to be related; I was hitting an error when running mocha in watch mode (--watch):

Error: ENOENT: no such file or directory, stat '/Users/<username>/Projects/<projectname>/ios/build/ModuleCache/2OOEZK7ULMT9F/_Builtin_intrinsics-1QSLWXKIZ9CUS.pcm.lock'

The work-around that worked for me was running:

rm -rf ios/build/ModuleCache/*

any updates?

For me, when loading my own components, this was happening because I had used the .jsx extension and React Native was looking for .js for some reason!

Gosh, this is not minor. Ever since i somehow dropped into this rabbit hole i have several critical RN projects that are halted until i find a way to resolve it.

I have literally tried everything in this thread in sequence 4+ times each with no change in symptoms, I am wondering if i will soon wake to realize this is one of those special kind of nightmares only web developers have.

I was facing the same problem and was solved after doing these steps. watchman watch-del-all npm start -- --reset-cache rnpm link

Node version 4.2.4 npm 3.7.1

@dangrsmind I was in your shoes a couple weeks ago, and used the “nuclear option” to recover:

Rename your existing project folder MyProject > MyProjectOld

Delete node & npm: http://stackoverflow.com/questions/11177954/how-do-i-completely-uninstall-node-js-and-reinstall-from-beginning-mac-os-x

Now start over with fresh install of React-Native (per https://facebook.github.io/react-native/docs/getting-started.html): Install Node:

brew install node

Install React-Native:

npm install -g react-native-cli

Create new project (in your project folder):

react-native init MyProject

Run the new project:

cd MyProject react-native run-ios or react-native run-android You should have the basic Welcome to React Native! app running

Replace contents of MyProject with MyProjectOld (file-by-file)

npm install --save <any packages you need for MyProject>

It’s an ugly solution, but hopefully helps you get back up and running!

Hi all, been running into this bug for a day or so now. This is a pretty major blocker for me. I’m working from a starter repo, with examples that run perfectly until I start adding in new dependencies. I’ve tried every afore-mentioned suggestion to fix this but still get the same error. If anyone has another suggestion I’m open to any ideas.

In the process of trying to get to the up-to-date version of react-native from 0.14.2. Successfully installed version 0.15.0. Trying to install 0.18.0 at the moment but i am bumping into a similar issue.

Error building DependencyGraph: Error: Naming collision detected: /Users/path_to_project/node_modules/fbemitter/node_modules/fbjs/package.json collides with /Users/path_to_project/node_modules/react-native/node_modules/fbjs/package.json

My Package.json:

{
  "name": "snofolio",
  "dependencies": {
    "events": "^1.1.0",
    "flux": "^2.1.0",
    "jquery": "^2.1.4",
    "moment": "^2.10.6",
    "react-dom": "~0.14.0",
    "react-native": "^0.19.0",
    "react-native-blur": "^0.7.10",
    "react-native-calendar": "0.6.2",
    "react-native-camera": "^0.3.8",
    "react-native-carousel": "^0.4.4",
    "react-native-communications": "^0.2.3",
    "react-native-fs": "^1.3.0",
    "react-native-google-analytics-bridge": "^0.4.0",
    "react-native-image-picker": "^0.14.3",
    "react-native-image-progress": "^0.4.0",
    "react-native-qrcode": "^0.1.3",
    "react-native-radio-buttons": "^0.6.0",
    "react-native-swipeout": "^2.0.12",
    "react-native-uploader": "0.0.9",
    "react-native-video": "^0.7.1",
    "underscore": "^1.8.3",
    "whatwg-fetch": "^0.10.1"
  },
  "devDependencies": {
    "browserify": "^6.2.0",
    "watchify": "^2.1.1",
    "babelify": "^6.0.0"
  },
  "scripts": {
    "start": "watchify -t babelify js/main.js -o webbundle.js"
  }
}

nb: I do have under node_modules a react folder.

I tried the following commands without success:

• Delete the node_modules folder - rm -rf node_modules && npm install
• Reset packager cache - rm -fr $TMPDIR/react-* or node_modules/react-native/packager/packager.sh --reset-cache
• Clear watchman watches - watchman watch-del-all

I unfortunately have no clue at the moment, any idea or hint is welcome.

The error message is misleading. Just make sure you import react and react-native separately and properly first.

@ajnudnyy - if you have upgraded to React Native 0.26 then you might need to install “react” 15.0.2 which is a dependency. For me, after installing “react” it started to work for me.

@npomfret make sure:

• react 15.1.0 match react-native 0.27.0-rc
• react 15.0.2 match react-native 0.26.x

@jaimeagudo I just edited my previous comment

set aside a night to work on react-native, and i spent almost two hours trying all these solutions and not getting anywhere last night.

There is one more reason why you could get this error and get sent to this issue: You are trying to import a file with a .jsx extension (or other non-supported extension)! I don’t know why I gave my files a extension. I just realized now that it is not the ‘official way’.

In react-native@0.19.0 the following worked:

Hi.jsx

console.log('hi')

index.ios.js

var hi = require('./Hi.jsx')

now in react-native@0.21.0-rc you get the same UnableToResolveError error telling you to reset cache, do npm install, visit this issue etc, even though the reason is a totally different one.

Is it intended behaviour or a bug that .jsx doesn’t work? Are you supposed to always use .js?

FYI, I was too able to get around this.

Start your project in XCode, wait until you get the error in the emulator. Close out of your console window and start react-native from node_modules via npm run start, and then refresh the emulator a few times.

this worked for me too

1. in terminal go to project/node_modules/react-native
2. run npm start from here
3. try now