Running a React Native app on Android Emulator in M1 Mac

Using Android Studio Preview

Running a React Native app on Android Emulator in M1 Mac
My app running on Android Emulator on my M1 MacBook Air!

Hi, it’s Takuya. I have an M1 MacBook Air and have been waiting for Android Studio to support M1 macs so that I can use it for developing my React Native project. It’s been about a half year since an Android Emulator developer tweeted that he managed to run it:

It had a performance issue though, I heard that the recent Android Studio Preview has supported M1 chips pretty well. So I tried it.
I’ve got several issues to make it work, but thanks to Yacine, I managed to solve them. I’m gonna share how to get your RN project to work on Android Emulator on your M1 mac.

Install Android Studio Preview (Canary build)

Android Emulator for M1 is not available on stable releases yet. You have to use Android Studio Preview.
I’m using Arctic Fox (2020.3.1) Canary 15.

Setup M1 Android Emulator

  1. Go to Tools → AVD Manager, then click +Create Virtual Device….
  2. Pick a device definition you like, e.g., Pixel 5. Click Next.
  3. Pick a system image whose ABI is arm64-v8a. If you can't find any of them, check out the 'Other Images' tab.
Choose an `arm64-v8a`-based image

Download the ‘S’ or ‘R (30)’ API level. Now you can run the Android Emulator natively. Congrats!

Build errors you may get

If you are lucky enough, your project will be built just fine without any errors. Enjoy a cup of coffee. However, you may get some build errors like so:

The Jdk installation is invalid. 
Selected Jdk location is /Applications/Android Studio Preview.app/Contents/jre/jdk/Contents/Home.

and

Gradle sync failed: Could not install Gradle distribution from 'https://services.gradle.org/distributions/gradle-6.0.1-all.zip'

Because Android Studio Preview is not a stable version, they can happen for unknown reasons, even if the configurations looked correct.

Clear caches

There are several ways to clear project caches.

First, try File → Invalidate Caches / Restart….

Next, remove the following file:

~/Library/Application\ Support/Google/AndroidStudioPreview2020.3/options/jdk.table.xml

Note that the path can be different based on the preview version (In this case, it’s 2020.3). Then, launch Android Studio.

Completely uninstall Android Studio Preview and try again

If you still have the compile error, try reinstalling Android Studio Preview.
First, uninstall it completely. Be careful to do them, or you may lose the important files:

rm -Rf /Applications/Android\ Studio\ Preview.app 
rm ~/Library/Preferences/com.google.android.studio-EAP.plist  ~/Library/Preferences/com.google.android.studio.plist 
rm /Users/nora/Library/Preferences/com.android.Emulator.plist 
rm -rf '~/Library/Application Support/Google/AndroidStudioPreview2020.3' 
rm -rf ~/Library/Logs/Google/AndroidStudioPreview2020.3 
rm -rf .gradle

Then, install it again. That worked for me.


Now, my RN project works smoothly on my M1 MacBook Air!
I’m pretty happy.

Follow me online