react-native app crashes while I want to run debugger-ui react-native-debbugger - react-native

I have started my application and install npm packages using npm install, then as usual I have installed debug version of the application using npx react-native run-android, then started the application with npx react-native start. The works fine until I want to use debugger-ui and debug my application using react-native-debugger or fb-flipper.
The problem occurs when pressing r in the terminal and choosing Debug from the modal that appears on the emulator screen.
This is the error that I'm facing with int he terminal:
And also this one in the React Native Debugger tab in the chrome console:

As I'm using the latest version of react-native-reanimated in this project and have followed the installation instructions in the documentation I have used this command for installing that:
npm install react-native-reanimated#next
I have been looking into documentation and after reading that really carefully I have just figured out that the react-native-reanimated#2 is not going to work with react-native-debugger and you can run debugger-ui the documentation recommended to use facebook flipper another amazing developer tool for react-native apps.

Related

Developer menu appears transparent on iOS

After creating a vanilla React Native/Expo project from either expo init AwesomeProject or npx create-expo-app AwesomeProject, I end up with a transparent developer menu. A similar problem happened in the post Expo developer menu not showing on Android. I am experiencing the problem on a Mac with Monterey 12.6 and an M1 processor. So far the problem seems to only be on the simulator.
I've tried a clean install of Node with NVM before recreating a blank starter project, but still the problem persists.
Some version info:
Node: 16.18.1
npm: 8.19.2
Xcode: 14.1/14B47b
expo: ~47.0.6 => 47.0.6
react: 18.1.0 => 18.1.0
react-native: 0.70.5 => 0.70.5
Expo Workflow: managed
Basics of what I've done:
npx create-expo-app AwesomeProject
cd AwesomeProject
npm run ios
If I go back to using Expo SDK 45 and expo-cli#5.4.3 the menu starts working again.
Is there some way I can nuke it all from orbit and be sure I'm starting clean? The same set of commands above works on a coworkers computer, so I'm really lost.
I was finally able to solve this problem myself. My problem was not the fault of Expo or Expo Go, but rather the fact that my work laptop uses a corporate proxy that fiddles with certificates.
After opening up Console.app and watching Expo Go's logs, I saw a bunch of errors complaining about not being able to verify a certificate, with the name of my corporate proxy's CA in the errors.
I added and trusted the CA on my simulator and tried again. The developer menu appeared correctly, presumably because it could finally download some assets it needed.
check the dependencies in your package.json, if you have "react-native-reanimated": "someversion", delete it, and everything works. If reanimated is an essenential dependencies, remote debug from your phone will not work.
After deleting reanimated, run npm install or yarn install.
If this is not working, delete the folder node_modules and use expo install to install all modules.
Let me know if this works.

npx expo run:android -> CommandError: No development build (<package>) for this project is installed

After running npx expo run:android once, the app was pushed to the device and the app started up.
I then uninstalled the app on the device and then when I run npx expo run:android once again I get the error:
CommandError: No development build (<package-name>) for this project is installed. Please make and install a development build on the device first.
Learn more: https://docs.expo.dev/development/build/
I started another dummy project with another package name and the same thing can be reproduced after uninstalling once.
The built app is not installing once again on the Android device and then starting up.
The docs referenced in the error states https://docs.expo.dev/development/build/#locally-with-xcode-and-android-studio the following:
If you are comfortable setting up Xcode, Android Studio, and related dependencies, you can build and distribute your app the same as any other iOS or Android app.
The npx expo run commands will create a new build, install it on to your emulator or device, and start running it.
Not sure what I am doing wrong. Any help is appreciated.

`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.

Integrate viro-react into react-native project

Anyone here managed to integrate viro-react into react-native project? I followed the instruction in
the documentation
After that, I executed the project but not able to run.
This is the error that I got
Even though I run with gradlew installOvrDebug, still it failed.
If your configurations are correct then try running with any of these variants
ArDebug, GvrDebug or OvrDebug
Example running apllication with Augmented Reality:
Android
react-native run-android --variant=ArDebug
iOS
react-native run-ios --variant=ArDebug
I solved this problem with the following method:
Go to the Navigate to the node_modules/react-native/local-cli/runAndroid/runAndroid.js file and edit the lines that include installDebug change it to installArDebug
Go to the terminal and npm start
Open another terminal and react-native run-android
*Make sure that your device is plugged in and that you have android studio sdk paths in your environment variables. This should do the trick!

Could not install the app on the device - react native on windows 10

Everytime I try to launch a react native project I got this error
Could not install the app on the device, read the error above for
details. Make sure you have an Android emulator running or a device
connected and have set up your Android development environment
I reinstalled nodejs, python and jdk using choco as suggested on official docs. Every single packages is installed as well as sdk 23.0.1
I can see my virtual device if I run adb devices USB debugging is activated and it's running android 6.
I setup ANDROID_HOME path in environment variables, I'm using same sdk path as you can see in the picture. I also setup another one for JAVA_HOME and Python.
My PATH looks like this:
I just don't understand what I'm supposed to do. I'm using a surface pro 4, Windows 10. I can run projects using expo. I literally tried everything, restart computer, start cmd using admin, create new virtual devices, uninstall everything and start from scratch, it just don't work.
You have pointed out two issues; first, make sure you have an android emulator running. To do that, you run adb devices and you say you can see you device.
The other issue is with the environment. To make sure your environment is setup properly for android, go to the root of your react-native project. Open the android project using android studio.
All errors with your environment will show up, use the automatic fixes provided by android studio. Clean the project in android studio. Close studio and go back to command line, run react-native run-android
Everything should work now.
When doing react-native start it will intentionally hang at "Loading dependency graph" (its not really hanging, its just waiting to receive build/bundle signals). This is correct. You have to open a second terminal then do react-native run-android.
If you get errors, then cd android in your project folder then run ./gradlew clean, then after that do another react-native start then react-native run-android.
Solution is to delete all java JDK and reinstall v8 / change JAVA_HOME to the new path.
Also changing gradle-wrapper.propertiesfile for each project you want to run
# update gradle to latest version
distributionUrl=https\://services.gradle.org/distributions/gradle-4.4.1-all.zip
Sometimes it dosen't compile with v4 so I have to use v3. React native is definitely confusing.
after install dan update environment JDK now I can install app on my device