React Native - App is Crashing when opening Tabs - react-native

My App always crashes in Android Emulator.
Every time I navigate my App into Main Tabs my App Crashes with an error.
I think this is not caused of the React Native Navigation, I think because of the React Native Vector Icons because in Android it requires to Add Icon for the Tabs. This error just suddenly appear without changing any of my codes.
This is the error from React Native Debugger:
Uncaught (in promise) TypeError: Iterator value v is not an entry object
at new Map (native)
at file:///D:/Downloads/rn-debugger-windows-ia32/resources/app.asar/js/bundle.js:9:8044
at anonymous
These are my Dependencies:
"react": "16.6.3",
"react-native": "0.58.6",
"react-native-maps": "^0.23.0",
"react-native-navigation": "^1.1.493",
"react-native-vector-icons": "^6.4.1"
Feel free to ask for my codes and any questions. Thank you!

Usually this error happens when debugging via RND. If this is your case try the following:
Try to close and open debugger again. For some reason it fixes the situation sometimes.
If your debugger`s version is out of date try to update it.
Finally the step that usually works if the previous didn`t: reinstall react-native-debugger and clean your cache (npm start -- --reset-cache).
To reinstall RND (OS): brew cask reinstall react-native-debugger.
For windows use standard procedure of deleting (via Control Panel) and then installing RND again.

Related

Why does my Expo app run in Expo Go but not as a development build?

I've created a development build of an Expo app using EAS. Previously I would open the app in Expo Go by running npx expo start and scanning the Metro Bundler QR code.
Now, when I try to do the same thing, Expo Go asks whether I want to open the project in Expo Go or as a "Development Build". It works fine in Expo Go, but crashes immediately when I attempt to open the dev build. The error reads:
null is not an object (evaluating '_ReanimatedModule.default.createNode')
This error is suspiciously similar to one that I encountered earlier in development, which I resolved by downgrading to React Native version 0.69.6. I'm also encountering a second error that says "'main' has not been registered", but I suspect this is downstream of the first error.
I have the same issue when I try to run the app with npx expo start --dev-client.
Any ideas why I might be having this problem?
It sounds like you may have run expo prebuild (https://docs.expo.dev/workflow/prebuild/) which removes "main": "node_modules/expo/AppEntry.js", from app.json. Try to create a new expo app and look at it's app.json file.
When you run expo prebuild it changes a few things with your project (see "side effects" in the prebuild docs).
I'm actually working through some issues with that right now too. I thought I had to run prebuild but turns out I didn't have to. Ever since I ran it my app will not load via the dev-client way. I can however switch back to npx expo start (NOT npx expo start --dev-client, see the scripts section of app.json as that is also changed when prebuild is run).
Let me know if you are able to get your app to load after re-adding the main stuff to app.json.
Ps, are you by chance using react-native-google-mobile-ads?

yarn gets stuck while adding libraries (React Native)

I am trying to add the react-native firebase database library in my react native CLI app but yarn gets stuck while linking dependencies and after 5 to mins throws the following error.
error An unexpected error occurred: "EBUSY: resource busy or locked, unlink 'C:\\Users\\SAIM NASSER\\Desktop\\E-commerceApp\\node_modules\\react-native-photoeditorsdk\\android\\build\\intermediates\\library_java_res\\debug\\res.jar'".
Make sure you close bundler before you add or remove packages. Since you're on Windows, it could be a file is locked. You can either reboot your computer or use a program to tell you what's locking the file and unlock it. Then you can add/remove the packages, then you can start up the simulator etc. again.

react-native bundling failed Invalid call error when using 3rd party library

I wrote a React app which used a 3rd party library and had no issues. I am now trying to write the equivalent app in React-Native (as a learning exercise) and I am running into an error as soon as I try and call an API in the 3rd party library.
I am on a windows machine and have react versions
"react": "16.9.0",
"react-native": "0.61.5",
Error
The error I am seeing in the window showing the metro builder has
error: bundling failed: src\scripts\my3rdPartyLib.js: src\scripts\my3rdPartyLib.js:Invalid call at line 121:
require([something], function (....
In my Android emulator I am seeing
The development server returned response error code : 500
Note: It also fails if i have the library coming from node-modules as apposed to copying it into my "scripts" folder.
What I have tried
As per a thread on SO i uninstalled babel-preset-react-native and then installed it.
npm un -D babel-preset-react-native
npm i -D babel-preset-react-native#2.1.0
Afterwards I realised as I am on version 61 it uses "metro-react-native-babel-preset", my babel.config.js contains the following
module.exports = {
presets: ['module:metro-react-native-babel-preset'],
};
Does anyone have an idea how I can get the use of the 3rd party library working in my react-native app?
After Googling, it is my understanding that React Native uses the metro bundler which doesn't seem to support dynamic require().
https://github.com/facebook/metro/issues/52
React Native: require() with Dynamic String?
Further investigation into the library that i am trying to use, i see that it is expecting to either be run in the browser or a Node environment. For ReactNative this is not the case, therefore I believe I can not use this library in my application.

`expo start` in development stuck at "Tunnel Connected", QR code is unusable

I'm currently running a detached expo project in development mode. Whenever I run expo start or npm start in the terminal I get the following logs:
$ expo start
Starting project at /Users/johncd/workspace
Expo DevTools is running at http://localhost:19002
Starting Metro Bundler on port 19001.
Tunnel ready.
Your native app is running at expb675c828acbb437095bc6218883f56bb://192.168.1.12:19000
Logs for your project will appear below. Press Ctrl+C to exit.
The expected results would include a QR code after these logs, but there is none.
When I visit the DevTools at localhost:90002 I see the metro bundler is running on LAN and a QR code is available. However, when I scan this QR code, it results in an error reading "No usable data found".
I've tried checking for a Firewall (System preferences > Privacy > Firewall) but it appears to be turned off.
I have also tried uninstalling and re-installing expo-cli as well as the project and running expo start again but to no avail.
I've tried using npm start and yarn start. I have also tried running the project on a tunnel.
I created a test project using expo init test-project and successfully ran it using expo start, so it seems this issue is only occurring on this project.
I also tried running expo start --clear to clear the cache.
None of these have worked.
Any help is appreciated!
Versions:
"expo": "^33.0.0",
"expo-constants": "^5.0.1",
"expokit": "^33.0.4",
"react": "16.8.3",
"react-native": "https://github.com/expo/react-native/archive/sdk-33.0.0.tar.gz",
"react-native-unimodules": "^0.4.2",]
Running on OSX
You need to install expo client app first from the appstore, then the qr will be readable.
You need to install Expo Go application from app store.
I didn't see anywhere a mention of what platform you're trying to use (iOS or Android) but at least with iOS I can tell you that QR codes in Expo don't really work correctly anymore. I believe Apple prevented the Expo team from being allowed to serve the bundle through the Expo app anymore. What this means for you is that the workflow you should expect is to connect your phone to the device physically using a cable and serve the bundle through USB. You can also use an emulator and move to the device when it's convenient.

Cannot Convert Existing React Native to Expo: error with nativeVersion.major

Just downloaded the newest version of Expo XDE(2.20.1) and trying to convert an existing react native project into it. I followed precisely these steps, and when opening the app in Expo client on a real device, I got an error saying:
undefined is not an object (evaluating 'nativeVersion.major')
The problem happens both on Android and iOS.
Seems expo has a strict requirement of react/react-native versions, but unfortunately, I cannot find the version requirement list.
My current dependencies (which are quite up-to-date) are:
"react": "16.0.0",
"react-native": "0.49.3"
So, does this error indeed came from version conflicts? And if so, how do I solve the problem?
Your JS dependencies need to match the native code. With Expo SDK 21, which is based off of React Native 0.48, you can either use (recommended):
"react": "16.0.0-alpha.12",
"react-native": "https://github.com/expo/react-native/archive/sdk-21.0.2.tar.gz",
or:
"react": "16.0.0-alpha.12",
"react-native": "^0.48.4",
It's important you are careful with the versions when you update your dependencies. The upcoming React Native 0.49 (supported with Expo SDK 22) needs to use React 16.0.0-beta.5.
It might be easiest to create a new Expo project from scratch, then copy over your components. I've done this several times myself, and it's far easier than fighting whatever edge condition has affected you.
Remove your iOS build (./app/ios/build) folder and re-build.