Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

react-native and Visual Studio Emulator for Android

is it possible to run react native app on Visual Studio Emulator for Android (standalone) and if yes what are the steps to set it up? I can successfully start emulator, that part works but cant figure out how to config react-native to use it instead of "adb devices".

My current attempts end with error: Could not debug. Error while executing command 'adb devices': Command failed: adb devices 'adb' is not recognized as an internal or external command, operable program or batch file.

I know about Android Studio and virtual devices that come with it but I would like to try that as the last option. My environment is: Windows 10 pro, VS Code (with React Native Tools Extension), react-native, yarn.

UPDATE

even though I did not get anywhere in my attempts to make it work I just would like to share what knowledge I gained while struggling with this issue because it is possible that my issues are specific to my environment but it might work on another PC.

Theoretically it requires very few steps to run react-native in Visual Studio Emulator for Android in VS code without installing Android Studio or Visual Studio.

  1. Install Visual Studio Emulator for Android, standalone https://www.visualstudio.com/vs/msft-android-emulator/

  2. download Android Debug Bridge (adb)

it is included with Android SDK Platform-Tools, download and read more here: https://developer.android.com/studio/command-line/adb.html it downloads as zip file, you unzip it and then add a path to adb.exe in PATH environment variable, so you can execute adb command from any path. I am using yarn and it needs that to know where adb.exe is.

It is kind of a connector between your app and virtual or real android device it has to be running before you start emulator and basic command are:

to stop - adb kill-server

to start - adb start-server

to see list of devices that adb recognized - adb devices

  1. I also found a specific instruction on how to make Visual Studio Emulator for Android work with adb:

https://msdn.microsoft.com/en-us/library/mt228282.aspx

'Visual Studio Emulator for Android' devices are not listed in the Android Device Monitor

it is a registry edit for key

HKEY_LOCAL_MACHINE\SOFTWARE\Wow6432Node\Android SDK Tools

apparently Visual Studio Emulator for Android is using that and you can create it if it is not there and just add/modify Path variable to be a path to adb.exe.

  1. now you can start Visual Studio Emulator for Android and after that open integrated terminal in you react native VS code project and type:

yarn run android

and if I get it right (and in the perfect world) your app should get installed and shown in Visual Studio Emulator for Android, well, not for me, my emulator never shows up as a device when I type adb devices, all I see is a blank two lines.

So I think I spent enough time on this trying to make it work and in my case the answer to my own questions is:

theoretically you should be able to run Visual Studio Emulator for Android with react-native from VS code but in reality it probably will not work, so seek something more reliable.

I did see a little light at the end of the tunnel when I tried connecting my phone with USB using expo app, adb picked it up right away, "yarn run android" started doing something and expo even tried to load my app, I held my breath, my heart was racing, I was ready for a miracle... and .... boom... it just crashed, but this could be easier for me to resolve though, it appears some networking config issues, my phone does not recognize IP address which was in the output after running yarn and if this works,(big IF) then it is still good, I can run/debug react-native without using Android/Visual Studio.

Final update: could not make it work, stopped all attempts and went for Android Studio instead, Android Studio emulators work with react native and expo without any issues. (well, not yet, sample app runs OK at least.)

like image 392
vlscanner Avatar asked Mar 14 '18 01:03

vlscanner


People also ask

Can React Native run on Android?

Overview. React Native is an open-source mobile application framework created by Facebook. It is used to develop applications for Android, iOS, Web and UWP (Windows) providing native UI controls and full access to the native platform. Working with React Native requires an understanding of JavaScript fundamentals.

Does Visual Studio have Android emulator?

The Visual Studio Emulator for Android is included when you install Visual Studio to develop for Android, iOS, and Windows—all from one code base using familiar languages such as C#, JavaScript, and C++.


1 Answers

The same symptoms occurred to me when trying to set both React-Native and VS Emulator for Android together, and the following steps solved them:

  1. On the VS Emulator for Android, I checked my emulated phone's IP at the Tools/Network tab. Emulator Adapter #1 refers to the emulated phone.

  2. Then, I headed to the terminal and ran adb connect <ip_address>:5555. That made the emulated phone available to Android Studio as well as to React-Native.

like image 126
Marcelo Cardoso Avatar answered Oct 06 '22 19:10

Marcelo Cardoso