Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Workarounds] Packager unable to resolve module from /Users/node_modules/ #4968

Closed
satya164 opened this issue Dec 24, 2015 · 498 comments
Closed
Assignees
Labels
Bug Help Wanted :octocat: Issues ideal for external contributors. JavaScript 📮Known Issues This indicates an issue that refers to a bug or limitation of RN that is not currently being handled Resolution: Locked This issue was locked by the bot. Tech: Bundler 📦 This issue is related to the bundler (Metro, Haul, etc) used.

Comments

@satya164
Copy link
Contributor

satya164 commented Dec 24, 2015

There are various issues scattered around the repo related to this issue. Basically what happens is, for some packages, when you try to require some-module in a file, for example,

var someModule = require('some-module');

It is unable to resolve the package and the following error appears,

Unable to resolve module some-module from /Users/username/projectname/AwesomeProject/index.js: Invalid directory /Users/node_modules/some-module

This error message is a 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 (h/t @philikon).

Workarounds

Currently, the workarounds seem to be,

  • 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
  • Recreate the project from scratch
@brentvatne
Copy link
Collaborator

cc @amasad

@amasad
Copy link
Contributor

amasad commented Dec 25, 2015

@amasad
Copy link
Contributor

amasad commented Dec 25, 2015

That's really strange. Next time it happens can you list your watch roots? watchman watch-list

@hufeng

This comment has been minimized.

@martinbigio
Copy link
Contributor

Do we have a consistent repro case? I've experienced this too.

@Hybrid-Force
Copy link

Same problem here on version 0.17.0.

$ watchman watch-list
{
    "version": "3.8.0",
    "roots": []
}

@arypurnomoz
Copy link

I also got this problem when requesting for platform=ios

@udnisap
Copy link
Contributor

udnisap commented Dec 25, 2015

Do we have a way to recreate this? Any steps that might recreate.

@sgonyea
Copy link

sgonyea commented Dec 25, 2015

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 :).

@udnisap
Copy link
Contributor

udnisap commented Dec 26, 2015

Is this only seen in npm 3?

npm 3 uses flat dependency structure. essentially node_modules are not resides in individual packages but only on the top level. if we have references like {somepackage}/node_modules/... we will have issue. Does it ring any bells?

@sgonyea
Copy link

sgonyea commented Dec 26, 2015

I'm using npm 3.5.2. I'm not sure if it applies to npm 2.

@amasad
Copy link
Contributor

amasad commented Dec 26, 2015

I don't think we've tested on npm 3. Although the node resolution algorithm (which we implement) should still work. Are all of you seeing this using npm 3?

@Hybrid-Force
Copy link

@amasad No, I am using npm v2.14.7

@pcottle
Copy link
Contributor

pcottle commented Dec 27, 2015

👍 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 :P

@skevy
Copy link
Contributor

skevy commented Dec 28, 2015

@pcottle and whoever else is/has experienced this issue - putting up a repo (with node_modules checked-in) would be AWESOME to help debug this. I too have experienced it, and so have people on my team (on both npm 2 and npm 3). In our case, resetting cache and doing watchman watch-del-all has fixed it (though obviously that's not the ideal solution)...but I realllllly wanna see this fixed, and would be happy to dive in to do the fixing. So if anyone can repro and put up the test case on Github, that would be super helpful. Obv post node version along with it so that we can duplicate the env.

@pcottle
Copy link
Contributor

pcottle commented Dec 28, 2015

@skevy will do if I run into it again! My bad, I hadn't thought of checking in the repos -- usually i think of the package.json as being the source of truth (so all else doesnt matter).

Others seem to be reporting that restarting helps, so I'm worried its due to something in-memory (which means repro-ing is harder).

Anyways I'm getting a new laptop from FB in a few days which means a full reinstall of everything, so I'll post back if I run into it again

@philikon
Copy link
Contributor

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.

@jukkatupamaki
Copy link

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.

@martinbigio
Copy link
Contributor

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? ;)

@vjeux vjeux added the Good first issue Interested in collaborating? Take a stab at fixing one of these issues. label Dec 30, 2015
@udnisap
Copy link
Contributor

udnisap commented Dec 31, 2015

udnisap added a commit to udnisap/react-native that referenced this issue Dec 31, 2015
@willbattel

This comment has been minimized.

@iOSleep
Copy link

iOSleep commented Apr 19, 2018

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
}

@t3chnoboy

This comment has been minimized.

@binbinla

This comment has been minimized.

@arnold-almeida

This comment has been minimized.

@fzymek

This comment has been minimized.

@caitlintrussell
Copy link

I've had this same issue for the last day. We found something that worked for me, when nothing else seemed to; my global react-native install used a different version than my local. I had 54.1 local, 54.4 global. We removed the global and I'm up and running again!

@Johnsalzarulo
Copy link

@caitlintrussell - So sorry to be a bother - very new to react-native:

  1. How did you know your global react-native install was a different version than your local?
  2. How do you go about fixing this issue?

Any direction you could offer would be greatly appreciated.

Thanks! 🙏

@anon-r-7
Copy link

anon-r-7 commented May 7, 2018

@jiang-yi-siphty when you try the react-native option for presets, what kind of error do you receive?

@lasthrun
Copy link

i fix it by:

  1. xcode open "yourReactNativeProject/ios"
  2. run Product -> Clean
  3. After Clean success, run Product -> Build
  4. fix all Build error
  5. work!

i think it cause by we had doing some wrong script and it had edit some xcode setting file that git ignored, so we can not easier to solve it by revert or rebuild the project.

@YasheshSavani
Copy link

YasheshSavani commented Jun 1, 2018

Hello,
I have installed firebase in react-native using command " npm install --save firebase" then whenever i import " import firebase from 'firebase'; " below error shows up i have tried also installing 'react-native-firebase' but it doesn't work that well.

I have got this error as below during running my application on device :
screenshot_1527841687

EDIT:
The error which shown above is solved by rollbacking to firebase version 5.0.4 to 5.0.3.
As an extra information i found out that [email protected] run smoothly on ios but it is not much compatible to android at this time. Therefore if any body wants to use it on android they can install firebase by command:

" npm i --save [email protected] "

Thank you

@christianscott
Copy link

This just happened to me because VSCode had erroneously inserted import { Utils } from "handlebars" into one of my files. Super cryptic error message though:

img_1953

Removing the import statement fixed it.

@hramos hramos changed the title NPM modules get required from /Users/node_modules/ instead of the project directory Packager unable to resolve module from /Users/node_modules/ Jun 12, 2018
@hramos
Copy link
Contributor

hramos commented Jun 12, 2018

Locking as recent activity appears unrelated to the original discussion around what caused the packager to fail in this manner. Now that the packager has moved to https://github.com/facebook/metro, we might want to move the discussion to an issue on that repo instead.

@facebook facebook locked and limited conversation to collaborators Jun 12, 2018
@hramos hramos changed the title Packager unable to resolve module from /Users/node_modules/ [Workarounds] Packager unable to resolve module from /Users/node_modules/ Jun 27, 2018
@hramos hramos added the Tech: Bundler 📦 This issue is related to the bundler (Metro, Haul, etc) used. label Jan 29, 2019
@hramos
Copy link
Contributor

hramos commented Jan 29, 2019

Please continue discussion over at http://github.com/facebook/metro

@hramos hramos closed this as completed Jan 29, 2019
@hramos hramos added the 📮Known Issues This indicates an issue that refers to a bug or limitation of RN that is not currently being handled label Feb 7, 2019
@react-native-bot react-native-bot added the Resolution: Locked This issue was locked by the bot. label Jan 29, 2020
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Bug Help Wanted :octocat: Issues ideal for external contributors. JavaScript 📮Known Issues This indicates an issue that refers to a bug or limitation of RN that is not currently being handled Resolution: Locked This issue was locked by the bot. Tech: Bundler 📦 This issue is related to the bundler (Metro, Haul, etc) used.
Projects
None yet
Development

No branches or pull requests