react-native: Unable to resolve module

Description

Unfortunately, I’ve run into a devastating bug that prevents me from loading any new modules into my app. I first discovered this bug when reaching the part of a react native course by Stephen Grider where he goes into networking with Axios.

After installing Axios with NPM, I imported it, saved index.ios.js, and refreshed the simulator. After refreshing I was greeted with the message shown below:

Whenever I removed the import statement for Axios and refreshed, the error would go away:

Reproduction

To reproduce this, I’d suggest building the app with NPM and/or Yarn running on Node 4.7 or the latest LTS release, Node 6.9.2

I can provide a repository later today if that would help…

Solution - just a workaround…

Try this:

Click “Reset content and settings…” in the simulator’s drop down menu and confirm
Close the simulator after it reloads
Close the terminal window running watchman
Run the following commands within terminal inside of your project’s directory:

watchman watch-del-all
rm -rf ./node_modules
npm cache clean
yarn cache clean
rm -rf $TMPDIR/react-*
yarn install
npm cache clean
yarn cache clean
yarn add uuid

If you don’t have yarn installed, run these commands instead:

watchman watch-del-all
rm -rf ./node_modules
npm cache clean
rm -rf $TMPDIR/react-*
npm install
npm cache clean
npm install uuid

Rebuild the project inside of Xcode and be sure to make any suggested modifications prior to running the app.

Additional Information

NPM version: 2.15.9 -> 4.0.3 (just updated to the latest version and the bug remains)
Yarn version: 0.17.10
Xcode version: 8.2 (8C38)
React Native version: 0.39.2
Platform: iOS
Operating System: MacOS Sierra 10.12.2

I was really excited to finally get started with React Native but this bug absolutely kills my ability to proceed with any tutorials/courses. I’d really appreciate if someone could help me out with this.

Thanks 😃

About this issue

Original URL
State: closed
Created 8 years ago
Reactions: 38
Comments: 30 (4 by maintainers)

Most upvoted comments

Yes. In 0.37 there was reorganization of these files (maybe when the bug arrived?).

Recently this PR fixing path.sep issues by @jhen0409 was accepted and merged into 0.41.0-rc-0.

Looks like we’re good when 0.41 ships? I can confirm this weekend, but hopefully someone beats me to it.

Thanks all! I learned a lot here.

+12

skellock on Jan 20, 2017

move your project to another path

sw-tt-vipulparmar on May 25, 2017

I’m glad you solved it - thanks for also posting the solution here to help other folks!

lacker on Dec 15, 2016

Solved but in a terrible way

TL:DR; use this in your package.json for now

    "axios": "infinitered/axios#windows_friendly",

For some reason packager traces down a require inside a conditional, but only on Windows machines! How? I have no clue. Perhaps @cpojer / @ide et al. can illuminate how this could be? This require should never be called, but somehow it is traversed by packager.

Using my branch in npm (which comments out the offending require) fixes everything.

This issue in other tickets

Axios repo is tracking the issue here: https://github.com/mzabriskie/axios/issues/648
Another react-native ticket has been opened here: #11887
For those of you having this problem in apisauce: tracked here (https://github.com/skellock/apisauce/issues/47), you can get around this by using this branch, that uses the aforementioned branch.

    "apisauce": "infinitered/apisauce#windows_friendly",

I wouldn’t mind hearing the solution to this. I’m sure @skellock (who helped me track this down) wouldn’t mind seeing the solution either.

GantMan on Jan 20, 2017

This is so frustrating & annoying, the only thing that works for me is to create a completely new project & move my files over. Are there any updates on this?

11reed on Jan 17, 2018

Hi, I’m an Axios contributor. This conditional require works because when the compilation target of the bundle is web the http adapter is replaced with the xhr one. See https://github.com/mzabriskie/axios/blob/68ec2abc4a74777f746824b5595d58e07b44c119/package.json#L72

Has there been any change in the way RN resolves that?

rubennorte on Jan 20, 2017

Hey @lacker, I’m still experiencing this issue. Unfortunately, the solution I provided above is more of a workaround. Anytime I install a package with npm or yarn on any project, I have to go through the steps above ~~and more often than not, also restart my Macbook~~.

tedjames on Jan 8, 2017

Hi everyone, maybe it can help, I was having this issue because I was using a package that uses some nodejs utilities which are available on the global object. In other word, this package could only work in a nodejs env like and not within’ the react-native env. It was my mistake.

Hope it helps

maieonbrix on May 15, 2017