Gradle Essentials für React Native Entwickler
Tags: reactnative, gradle, android, androiddev
Published: 2024-01-14 20:13:41

## Einleitung

[Gradle](https://gradle.org/) ist für die Entwicklung von _React Native_ Apps auf _Android_ ein unverzichtbares Tool. Dennoch ist es vor allem für _React Native_-Entwickler ein Buch mit sieben Siegeln, da ein Großteil einen Web-Background hat und somit eher mit _JavaScript_ vertraut ist. In diesem Artikel werden die Essentials behandelt, mit denen man als _React Native_-Entwickler vertraut sein sollte, um effektiv mit _Gradle_ zu arbeiten.

## Grundlagen von Gradle

Gradle ist ein mächtiges Build-Automatisierungstool, das vor allem in der Entwicklung von _Android_-Anwendungen verwendet wird. Es nutzt eine [Domain-Specific Language](https://en.wikipedia.org/wiki/Domain-specific_language) (DSL) basierend auf [Groovy](http://www.groovy-lang.org/) oder [Kotlin](https://kotlinlang.org/), um die Build-Konfiguration zu definieren. In _React Native_ wird _Groovy_ verwendet und die wichtigsten Dateien für Entwickler sind die beiden _build.gradle_ Dateien.

### Syntax

Ein _Gradle_-Build besteht aus einem oder mehreren **Projekten**. Jedes **Projekt** repräsentiert eine Komponente des Gesamtbuilds (z.B. eine App, ein Library-Modul, ...). Die grundlegenden Aktionseinheiten in einem _Gradle_-Build sind **Tasks**. Ein **Task** repräsentiert eine atomare Build-Aktion (Kompilieren von Quellcode, das Erstellen von Paketen, ...). Über **Plugins** oder externe **Repositories** können zusätzliche Funktionen bereitgestellt werden.

### Build Gradle Dateien in React Native Projekten

In _React Native_ Projekten gibt es zwei unterschiedliche _build.gradle_ Dateien. Eine im _android_ Ordner (Projektebene), sowie Eine unter _android/app_ (Modulebene).

#### Projektweite build.gradle Datei

Die Datei direkt im _android_ Ordner dient der Konfiguration des gesamten Projekts. In der Theorie könnte es zusätzlich zu _android/app/build.gradle_ noch weitere verschiedene Module mit jeweils eigenen _build.gradle_-Dateien geben. In einem frischen _React Native_ Projekt hat sie in der Regel folgendes Format:

```groovy
// Top-level build file where you can add configuration options common to all sub-projects/modules.
buildscript {
    ext {
        kotlinVersion = "1.8.0"
        buildToolsVersion = "33.0.0"
        minSdkVersion = 24
        compileSdkVersion = 33
        targetSdkVersion = 33

        // We use NDK 23 which has both M1 support and is the side-by-side NDK version from AGP.
        ndkVersion = "23.1.7779620"
    }
    repositories {
        google()
        mavenCentral()
    }
    dependencies {
        classpath("org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlinVersion")
        classpath("com.android.tools.build:gradle")
        classpath("com.facebook.react:react-native-gradle-plugin")
    }
}
```

- `buildscript` definiert die Umgebung in der das Script ausgeführt wird. Es legt fest, welche Plugins und Dependencies für die Ausführung des _Gradle_-Build-Scripts selbst benötigt werden.
- `ext` ist zuständig dafür Versionsnummern für Dependencies zu definieren sowie die SDK-Zielversionen festzulegen.
- `repositories` definiert Repositories, von denen _Gradle_ die Plugins und Dependencies herunterladen soll, die für das Build-Script benötigt werden.
- `dependencies` listet die Abhängigkeiten auf, die zum Bauen der App benötigt werden, z.B. das _React Native_ Plugin oder das _Kotlin_ Plugin.

#### Appweite build.gradle Datei

Die Datei im _android/app_ Ordner ist spezifisch für das verwendete Modul:


![Projektweite build.gradle Datei](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/0m6beigeytycg9t4s50l.png)



- Am Anfang der Datei werden die verwendeten Plugins definiert, z.B. `apply plugin: 'kotlin-android'`, welches dafür sorgt dass in der App _Kotlin_ verwendet werden kann.
- Der Key `android` definiert _Android_-spezifische Einstellungen, wie z.B. die `compileSdkVersion`, welche auf die in der projektweiten _build.gradle_ definierte Version via `rootProject.ext.compileSdkVersion` zugreift.
- `dependences` definiert die in diesem Modul verwendeten Abhängigkeiten, wie z.B. das _React Native_ Plugin via `implementation("com.facebook.react:react-android")`.
- `apply from: file("../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesAppBuildGradle(project)` bezieht sich auf das Einbinden sowie Aufrufen einer _Gradle_ Script - Datei.

### Weitere Gradle Dateien

Neben den beiden _build.gradle_-Dateien, die sicherlich am wichtigsten sind, gibt es noch folgende Dateien:

#### settings.gradle

In dieser Datei werden alle Module/Subprojekte aufgelistet, die zum Gesamtprojekt gehören, sowie die Pfade zu den nativen Modulen definiert:

```groovy
rootProject.name = 'ReactNativeDemo'
apply from: file("../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesSettingsGradle(settings)
include ':app'
includeBuild('../node_modules/@react-native/gradle-plugin')
```

#### gradle.properties

Hier werden Konfigurationsoptionen und Eigenschaften festgelegt, die sowohl von Gradle als auch von _React Native_ verwendet werden können:

```groovy
# Project-wide Gradle settings.

# IDE (e.g. Android Studio) users:
# Gradle settings configured through the IDE *will override*
# any settings specified in this file.

# For more details on how to configure your build environment visit
# http://www.gradle.org/docs/current/userguide/build_environment.html

# Specifies the JVM arguments used for the daemon process.
# The setting is particularly useful for tweaking memory settings.
# Default value: -Xmx512m -XX:MaxMetaspaceSize=256m
org.gradle.jvmargs=-Xmx2048m -XX:MaxMetaspaceSize=512m

# When configured, Gradle will run in incubating parallel mode.
# This option should only be used with decoupled projects. More details, visit
# http://www.gradle.org/docs/current/userguide/multi_project_builds.html#sec:decoupled_projects
# org.gradle.parallel=true

# AndroidX package structure to make it clearer which packages are bundled with the
# Android operating system, and which are packaged with your app's APK
# https://developer.android.com/topic/libraries/support-library/androidx-rn
android.useAndroidX=true
# Automatically convert third-party libraries to use AndroidX
android.enableJetifier=true

# Version of flipper SDK to use with React Native
FLIPPER_VERSION=0.182.0

# Use this property to specify which architecture you want to build.
# You can also override it from the CLI using
# ./gradlew <task> -PreactNativeArchitectures=x86_64
reactNativeArchitectures=armeabi-v7a,arm64-v8a,x86,x86_64

# Use this property to enable support to the new architecture.
# This will allow you to use TurboModules and the Fabric render in
# your application. You should enable this flag either if you want
# to write custom TurboModules/Fabric components OR use libraries that
# are providing them.
newArchEnabled=false

# Use this property to enable or disable the Hermes JS engine.
# If set to false, you will be using JSC instead.
hermesEnabled=true
```

#### gradle-wrapper.properties

Diese Datei definiert die verwendete _Gradle_-Version und verwaltet weitere Optionen wie z.B. Downloadort:

```groovy
distributionBase=GRADLE_USER_HOME
distributionPath=wrapper/dists
distributionUrl=https\://services.gradle.org/distributions/gradle-8.0.1-all.zip
networkTimeout=10000
zipStoreBase=GRADLE_USER_HOME
zipStorePath=wrapper/dists
```

## Schlusswort

Zusammenfassend lässt sich sagen, dass es für fortgeschrittene _React Native_-Entwickler unverzichtbar ist, ein zumindest grundlegendes Verständnis von _Gradle_ aufzubauen, auch wenn es zunächst komplex erscheinen mag. Durch das Verständnis der verschiedenen _Gradle_-Dateien und ihrer spezifischen Rollen kann die Konfiguration des Projekts effektiver verwaltet und angepasst werden. Es ist eine Investition, die sich langfristig auszahlt, denn ein tiefgreifendes Verständnis von _Gradle_ ermöglicht eine flexiblere und leistungsfähigere App-Entwicklung auf _Android_.