React Native – All about setup

Android

Setup

• Install Android Studio, Android SDK, emulator
• Create ~/.zshrc file

export ANDROID_SDK_ROOT=~/Library/Android/sdk
export ANDROID_HOME=~/Library/Android/sdk
alias run-android="$ANDROID_HOME/emulator/emulator @Pixel_3_API_29"

• Download Java if this error occurs

https://www.java.com/en/download/

• Restart Mac or restart ~./zhsrc

source ~/.zhsrc

• Add following scripts to your package.json

    "reset": "rm yarn.lock; rm -rf android/app/build; rm-rf ios/build/; watchman watch-del-all; rm -rf node_modules; yarn; npx pod-install; yarn start --reset-cache",
    "restart": "watchman watch-del-all; yarn start --reset-cache",
    "android": "react-native run-android",

• Run app onto Android emulator

yarn restart

yarn android

How to build Android debug mode?

• Step 1

react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res

• Step 2

$ cd android
$ ./gradlew assembleDebug

• Step 3

apk file is exported here

yourProject/android/app/build/outputs/apk/debug/app-debug.apk

How to build Android release mode?

https://medium.com/geekculture/react-native-generate-apk-debug-and-release-apk-4e9981a2ea51

app/build.gradle

    signingConfigs {
        release {
            storeFile file('keystore.jks')
            storePassword 'xxxxxxxxx'
            keyAlias 'yyyyyyyy'
            keyPassword 'xxxxxxxx'
        }
    }
    buildTypes {
        release {
            minifyEnabled enableProguardInReleaseBuilds
            proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
            signingConfig signingConfigs.release
        }
    }

Run command

• Step 1 is as debug build

react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res

• Step 2

$ rm -rf android/app/src/main/res/drawable-* && rm -rf android/app/src/main/res/raw/*

• Step 3

$ cd android
$ ./gradlew assembleRelease

• apk file is exported here

android/app/build/outputs/apk/release

How to check your React Native environment?

npx @react-native-community/cli doctor

AppCenter

How to implement custom build script?

Create “appcenter-pre-build.sh” in root folder

#!/usr/bin/env bash

# Example: Change bundle name of an iOS app for non-production
if [ "$APPCENTER_BRANCH" != "master" ];
then
    plutil -replace CFBundleDisplayName -string "\$(PRODUCT_NAME) Beta" $APPCENTER_SOURCE_DIRECTORY/MyApp/Info.plist
fi

# Example: Copy env files into iOS folder
cp .env* iOS/