Development Environment & Build

1. PowerShell in Administrator mode Right-click Windows Terminal, run as Administrator
2. Chocolatey for PowerShell Package Manager for Windows PowerShell, similar to Apt on Ubuntu Chocolatey
3. Git for Windows choco install git
4. Micro the In-terminal Editor choco install micro choco install nano # Optional
5. NVM (Node.js Package Manager) choco install nvm Need to close PowerShell terminal and start back after installing NVM.
6. Node.js Latest nvm install latest
7. Install Java choco install microsoft-openjdk11 See the link in React Native Setup section below for the info about JDK version, newer versions won't work. Close terminal and reopen, don't create JAVA_HOME env var which is similar to C:\Program Files\Microsoft\jdk-11.0.18.10-hotspot done by Choco; also don't add the bin dir inside JAVA_HOME to PATH.
8. Install Android Studio Download and Install Android Studio for Android SDK and the emulator. Set the env var ANDROID_HOME to the installation folder of Android SDK as in the installation dialogue. Add dir platform-tools in ANDROID_HOME to PATH.
9. React Native npm i -g react-native Do not install react-native-cli, it's already inside.
10. Init Project Go to project dir and run: npm config set legacy-peer-deps true # Accepts dependency conflicts react-native init app —template react-native-template-js
11. Open Android Studio Just to see the code converted from JS to Java, open folder (don't change anything, it breaks the transpiled code by React Native): PROJECTDIR/app/android
12. Run Metro Bundler cd app react-native start # Optional: —reset-cache Newer command (but run 'npm run android' in separate terminal): npm start # Use this
13. Run App cd app react-native run-android Newer command (in another terminal beside 'npm start'): npm run android # Use this

Build-time Errors

Don't mind the error PreactNativeDevServerPort=8081, it's failed build and no app to connect to.

• Build-time Error: Due to Template Mismatch with React Native
  • Execution failed for task ':app:checkDebugAarMetadata'
    • https://stackoverflow.com/a/68221656/5581893
    • In app/android/build.gradle, change the compileSdkVersion = 29 to the min value specified in error.
• Build-time Error: Due to Wrong Kotlin Version
  • Execution failed for task ':react-native-webview:compileDebugKotlin'
    • https://stackoverflow.com/a/76219148/5581893
    • In app/android/build.gradle, add kotlinVersion = "1.6.0" in buildscript.ext
    • The version "1.6.0" is after Module was compiled with an incompatible version of Kotlin. The binary version of its metadata is … which is the line after Error: Command failed: gradlew.bat app:installDebug` but not related to the port error.

android {
    packagingOptions {
        pickFirst '/.so'
    }
}

• Build-time Error: Due to Multiple Lib Binaries Found
  • Execution failed for task ':app:mergeDebugNativeLibs'
    • More than one file was found with OS independent path 'lib/armeabi-v7a/libfbjni.so'
    • https://stackoverflow.com/a/74526307/5581893
    • Location for packagingOptions: https://gitlab.com/telosid/samples/onyx-react-native-example
    • Fix with adding the following block to android/app/build.gradle, not android/build.gradle:
• Build-time Error: Due to Old Commands
  • error: ReferenceError: SHA-1 for file
    • Use 'npm start' and 'npm run android' in 2 separate terminals
• Build-time Error: Due to New Node.js
  • Failed to construct transformer: Error: error:0308010C:digital envelope routines::unsupported
  • Node.js 17+ needs option for legacy OpenSSL
  • Run with $env:NODE_OPTIONS="--openssl-legacy-provider"; npm start

Reference

React Native on Windows