React Native Troubleshooting

Situation 1. New (Just Created) React Native Project now working

You decided to start develop React Native Application and after installation React Native library you create new project and try to run it on iOS Simulator.

npm install -g react-native-cli

react-native init AwesomeProject

cd AwesomeProject

react-native run-ios

And You getting Error

Lets see what versions are used. React native Version 0.45. For knowing version of React Native that used in project open file package.json in project folder. I found this issue June 10, 2017. 

Dependencies in package.json file

"dependencies": {
 "react": "16.0.0-alpha.12",
 "react-native": "0.45.0"
}

Error screens

Solution

And what we have to do here?

1. Stop process and close all terminal windows (close react packager window)
2. Open terminal window again
3. Go to project folder
4. Run command 

1. npm run start -- --reset-cache

5. Open project in xcode and run it
6. It should be work

XCode Compilation Success

Run successfully and without errors on the simulator

Sources

• Facebook React Native Library
• Github React Native Issues
• React Native Stackoverflow Errors Solutions

Situation 2. React Native Project now working after adding npm library

For example, you want to add new cool library to your project. For me this library is
react-native-svg

You install the library 

npm install react-native-svg --save

After you link the library

react-native link react-native-svg

Then you try to run your project from XCode 

(after invoking) 

npm run start -- --reset-cache

And finally you get an error

Let's see more detailed what error it is

Solution

So, this error happen because of problems with tvOS targets. Because  don't need tvOS target in project I just remove them.

Targets before removing tvOS

Target after removing tvOS

Next, I remove library named libRNSVG-tvOS.a for tvOS from iOS Target Linked Frameworks and Libraries. And try to run application.

Try to run project and everything goes successfully

App now is successfully running

Sources

• react-native-svg library on github

Situation 3. React Native Project got error "Cannot find module 'jest-haste-map'" when you try to update version of some library

For example, you try to update or install library for Facebook integration (react-native-fbsdk) 

react-native install react-native-fbsdk

and you get the error

module.js:472
    throw err;
    ^

Error: Cannot find module 'jest-haste-map'
    at Function.Module._resolveFilename (module.js:470:15)
    at Function.Module._load (module.js:418:25)
    at Module.require (module.js:498:17)
    at require (internal/module.js:20:19)
    at Object.<anonymous> (/Users/alexeydanilov/Documents/work/ipoint/badlibs-react-native/node_modules/react-native/packager/src/node-haste/DependencyGraph.js:16:22)
    at Module._compile (module.js:571:32)
    at loader (/Users/alexeydanilov/Documents/work/ipoint/badlibs-react-native/node_modules/babel-register/lib/node.js:144:5)
    at Object.require.extensions.(anonymous function) [as .js] (/Users/alexeydanilov/Documents/work/ipoint/badlibs-react-native/node_modules/babel-register/lib/node.js:154:7)
    at Module.load (module.js:488:32)
    at tryModuleLoad (module.js:447:12)

Solution

Solution is simple. You just need to remove react-native and install it again.

npm uninstall react-native

npm install react-native

After that you can try to install library again and it should be work fine.

npm-install info Linking react-native-fbsdk android dependency 
rnpm-install info Android module react-native-fbsdk has been successfully linked 
rnpm-install info Linking react-native-fbsdk ios dependency 
rnpm-install info iOS module react-native-fbsdk has been successfully linked 
rnpm-install info Module react-native-fbsdk has been successfully installed & linked