I am running my React Native app in Visual Studio Emulator for Android. Can someone tell me how can i debug my js code ? In Android studio simulator we have options to remote debug. But from Visual studio Emulator how can i debug..Thanks in Advance.
If you have chrome installed, then you can use the chrome debugger to debug your js code.
First
Mac: command + M
Window: control + M
Then click debug js remotely; It will open a tab in chrome, then right click and select inspect, switch to the console tab. Any statement you console will appear there.
There are two ways you can debug your code.
First one : Using visual studio debug menu.
Press ctrl+shift+D to open up debug menu and select Attach to Packager or select 4th item on the left in visual studio.
This allows you to set break points and debug code as you see in Android Studio.
Second one : Using React Native Debugger
Related
I'm using Visual Studio 2017 to build and deploy a NativeActivity to my Android device. It builds and deploys with no issues, but I cannot set breakpoints.
Before running, I can add a breakpoint to a line (the first line of android_main() for example) and the little red circle shows up on the left of that line in the IDE as you'd expect.
But after installing and running the app, the breakpoint doesn't trigger because the red circle has turned white - it's saying there are no debug symbols.
I've verified I'm building the Debug version and have verified the APK file is bigger and has the debug symbols by using Android Studio.
At this point it appears to me that Visual Studio itself is confused and somehow doesn't recognize the debug symbols.
I've added "-g" to the C++ options manually, and have added the Gradle line packagingOptions.doNotStrip '**.so' as well. But still this problem persists.
What would cause this behavior in Visual Studio and how can I fix it?
The Xamarin debugger can only debug managed (i.e. C#) code. Breakpoints only work with the Xamarin debugger if the project being debugged is a managed project. They don't work if the project is a native app or native library.
So you have to make NativeActivity c++ app be attached to a Xamarin Managed App(Acttach to Process）to get what you want.
1) create a c# xamarin android app and then input that xamarin managed apk file into the NativeActivity c++ app's Properties-->Debugging-->Package To Launch
2) start Xamarin c# app first and then make the Xamarin debugger active. While the managed app is still running or being debugged, right-click on the native library project and select Debug --> Attach to Android process.
Here is an example provided by Richard Walters and he provided the detailed info.
I have updated my react native app to version 0.62.0 from 0.59.0 some time ago. I am able to debug the app on ios simulator and device but not able to get the in app developer menu on android by pressing the command+m key for emulator and device (on shaking the device). While updating I skipped the code for Flipper which is a new debugging tool that comes by default with RN 0.62.0.
I am also not able to see the change in app when I run the app from Android Studio.
Is it not possible to use the shake gesture feature or debug the app without Flipper on Android ?
You can use this command from terminal, I set it up to a hotkey so I can do it quickly cause its annoying to have to shake your device anyway..
First time you need to do this to get device list and it will return a list of devices, choose the number for your device, something like "2663404d12057ece"
adb devices
To open developer menu on device use command:
adb -s YOUR_DEVICE_NUMBER shell input keyevent 82
I found the solution, MainApplication.java file contained this import statement import com.facebook.react.BuildConfig; which is not needed. The BuildConfig.java should be pulled from android/app/build/generated/source/buildConfig/debug/[your]/[package]/[name]/BuildConfig.java instead, which is imported automatically when the project is build/synced in Android Studio.
After I remove the import statement I was able to see the developer menu and reload the app.
I can't seem to figure out how to make debugging work for a native Android module invoked from a Flutter app via a Platform Channel. I'm using the sample from the Flutter documentation (https://flutter.dev/docs/development/platform-integration/platform-channels). I've tried the following:
Open the Flutter project in IntelliJ
Right click the android folder and select Flutter | Open Android Module in Android Studio
Android Studio opens the native Android code.
Set breakpoints in Android code
Click Debug from Android Studio
Emulator shows "Waiting for Debugger Application is waiting for deubgger to attach" while in Android Studio the debug console shows 'Connected to the target VM, address: 'localhost:8601''
Run Flutter App from IntelliJ (I've also tried Debug from IntelliJ - flutter code will stop on breakpoints)
The breakpoints fro the native Android code never breaks
What am I doing wrong?
I started another project and was able to get it working.
To debug the Flutter code, start the debugger from IntelliJ
To debug the native android code, right click on the android folder and select Flutter | Open Android Module in Android Studio. Start the debugger there. The Flutter app will open in the emulator and you can set/hit breakpoints in the native code
What worked for me was running the app in debug mode in Android Studio and then pressing the "Attach Debugger to Android Process" button.
I currently need to use the following steps to run and debug React Native Android App using Android Studio and Google Chrome:
Start up Android Studio
Setup emulator
Go to terminal, run npm start
Choose the desire flavour
Run the emulator
Remote debug in Chrome
I wonder if life can be made easier to use Visual Studio Code (possibly with some official plugin) to do all the above in a single click? Please list out the steps to configure it.
Debug react native android and ios app using Visual code, We need to add addition plugin into VSC React native-Full Pack
Step 1.
Install React Native - Full Pack extension
Step 2.
Connect the mobile device using USB debugging mode or open emulator from the android studio.
Step 3.
Click on debugging option from the left menu in visual code studio Click on Add configuration and select React Native then create launch.json
Step 4.
Open dev option in the phone on the long back press or shake the phone and Enable Debug js remotely
Step 5.
Final step click on play button and select Debug android or Debug ios
For more information refer this link
https://medium.com/#tunvirrahmantusher/android-debug-with-vscode-for-react-native-96f54d73462a
I used to open the react native dev tools on my android emulator (AVD) using ctrl+M.
But lately it stopped working.
I have tried to change the android keyset but it didn't help.
I put a breakpoint inside the java code and I noticed that I didn't get key pressed event for ctrl+M or other control keys (I got for other keys).
I am using UBUNTU 14.0.4, android SDK manager 25.1.6, react native 0.24.1.
Please help.
Thanks