🔥🔥🔥 Develop Android Apps using React-native: Setup on Mac M1 and troubleshooting

Install Java and platform tools

Note that at the time of this writing, Java 16 is NOT supported by React Native! Java 8 is safe to install.

## Install Java and android platform tools
brew tap adoptopenjdk/openjdk
brew install --cask adoptopenjdk8
brew install android-platform-tools

Install Android SDK

brew tap homebrew/cask
brew install --cask android-sdk

Install Android Studio

Go to Google's Android Studio download page and install.

Set environment variables

This is super important, and many errors in react-native CLI failed, because of these incorrect settings. Run below code in the terminal:

echo export "ANDROID_HOME=${HOME}/Library/Android/sdk" >> ~/.bash_profile
echo export "ANDROID_SDK_ROOT=${HOME}/Library/Android/sdk" >> ~/.bash_profile
echo export "ANDROID_AVD_HOME=${HOME}/.Android/avd" >> ~/.bash_profile

# Optional, for zsh shell only
echo "[[ -s ~/.bashrc ]] && source ~/.bashrc" >> ~/.bash_profile

To test if this is successful, try below:

source ~/.bash_profile
echo $ANDROID_HOME

Install node.js/npm, yarn and Watchman

brew install node
brew install yarn
brew install watchman

Double check if every setting is good

npx react-native doctor

You will see some errors like below:
image

You might wish to fix some of the errors, e.g. JDK with below commands:

brew install --cask adoptopenjdk11

Now the error will be fixed:
image

Note: You may ignore the Android SDK errors!

Run command to create a new project

npx react-native init demo

Install M1 Android Emulator

Download the DMG file and install the emulator as a Mac OSX app. Start the emulator before you run:

npx react-native run-android

Hooray! Now you should be able to run react native android app in Apple M1 desktops/laptops!

24