Unable to connect react-native debugger in Ubuntu(22.04) - react-native

I am trying to install react native debugger(version 0.12.1) in ubuntu. The error message was as displayed in this screenshot on first launch.
However, even after installing react-devtools ^4.22.0 globally , it continues to display the same error message. I also looked into this discussion but it was not helpful.I am using npm as a package manager tool..
Any kind of help will be appreciable !!
Update-1 : I was able to successfully connect to the debugger ui. But i was unable to access element inspector and redux state.

Related

Metro Bundler does not start (MacOS)

I installed React Native following the requirements in the documentation (https://reactnative.dev/docs/environment-setup) , i got all the simulators working but i have to manually open them everytime i open the project.
If i press m after npm start the following error shows "warn No apps connected. Sending "devMenu" to all React Native apps failed."
(Btw this is my first time using React-Native so sorry if this is a rookie mistake)
Does anyone know any solution ?

react-native-debugger disconnecting and showing error when In-App Developer Menu is opened

I have recently upgraded my react native to the latest version 0.62.1 and also downloaded the required react-native-debugger app (standalone app version 0.11.1 ) as specified in the react-native-debugger doc. Now when i enable remote js debugging everything works fine until i press cmd + d for ios or cmd + m for android to open in app developer menu after that debugger is disconnecting automatically and showing the error as shown in the below image.
link to react-native-debugger error image when in app developer menu is opened
As shown in the above image it says Bridge was already shutdown. Because of this i am unable to do inspect element inside react-native-debugger. I have searched in the internet regarding this specific error but unfortunately i did't find any solution.
Edit 1
I have set up a new react native project with react-native-cli and tested. It is also giving the same error. I don't know whether the problem is with new react native version 0.62 or react-devtools version 4.
This error appears to go away in react-native#0.66.0, but I experienced it on 0.64.2. The workaround I found was to open inspector without using the dev menu. Two ways:
cmd + i
Right-click inside react-native-debugger and select "Toggle Element Inspector"
If you do open dev menu and break connection again, simply reload to reset the state.
You might also need to confirm your app's react-devtools-core version from your node_modules or lock files match the version embedded inside react-native-debugger. I documented all this here:
https://gist.github.com/sschottler/7771dc034d38b89d9d587dc5d358c386

Devtools failed to connect to react native emulator

I execute the project with react-native run-android and in another terminal, i do:
npm run react-devtools
and it opens the new window of electron that says:
The react native app it will open in a few seconds...
but nothing happens.
I put in the simulator toggle inspector with Ctrl + m and i can see in networks that it makes a request to http://localhost:8097 and the result is it fails to connect and keeps trying with the same result.
devtools can not to connect to emulator, It write connecting... And show a link for troubleshoot but link doesnt work. With ctrl shift i in devtools, I can understand error is fail to connect because of backend.js. Can Any body help me?
Make sure pors is forwarded from the emulator.
Use adb reverse tcp:8097 tcp:8097 to enable
See https://fig.io/manual/adb/reverse for more details

RNTester : Unable to find React Native files

I was going through a react-native tutorial and got a suggestion to check RNTester
I followed the steps of cloning and installing mentioned on github. But when I hit the run button on Xcode I get following error:
error Unable to find React Native files. Make sure "react-native"
module is installed in your project dependencies. Process terminated.
Press to close the window
The simulator is also launched with bunch of method names.
Any help is appreciated.

React native init not working

I posted this in the react native github but was asked to post here
I following the instructions on the website to get a react native app up and running.
I get the following messages
Genymotion Andriod simulator Reference Error: can't find variable _fbBatchedBridge
IOS simulator Unable to execute JS call: _fbBatchedBridge is undefined
React Package Manager synchonization failed
React native version 0.18.0
React native cli 0.1.10
Node 4.2.4
Mac Os X Yosemite
XCode Version 7.2
In researching this many claim that the issue is with the network. I opened a browser pointing at localhost:8081 and get a webpage with Cannot GET /
Currently I am not getting any error message on the IOS simulator, just a blank white screen. Android is still giving the same error message on both Genymotion and on my local android device.
There are no error messages on the Terminal or in XCode.
This is very frustrating to try to troubleshoot since I have no idea why it is not working and even where to start.
This error is because the script server is not running.
For Android version, in addition to execute 'react-native run-android' to build the app, you need to execute 'react-native start' to start the script server.
In XCode when you run the application the terminal should be started automatically, but it seems something is wrong in your case. Did you try to close the terminal window and start over?
==============================
when you first start the script server, the console should show
[18:07:15] <START> Building Dependency Graph
[18:07:15] <START> Crawling File System
[18:07:15] <START> Loading bundles layout
[18:07:15] <END> Loading bundles layout (1ms)
React packager ready.
When your client connects to the server, the console should show
[18:07:25] <START> request:/index.android.bundle?platform=android&dev=true
[18:07:25] <START> find dependencies
[18:08:01] <END> Crawling File System (45771ms)
[18:08:01] <START> Building in-memory fs for JavaScript
[18:08:04] <END> Building in-memory fs for JavaScript (3382ms)
[18:08:04] <START> Building in-memory fs for Assets
...
if the second part was not showing up, you may want to check whether you can use the port:
With this image you can see the url should be http://localhost:8081/index.android.bundle?platform=android&dev=true . If you cannot open it in your browser you may need to check your firewall setting or anything else blocking the access.
Also you may want to search index.android.bundle in your native code to check whether the dev url has been modified.