Erste Schritte mit React Native

Artikel
03/15/2024

Wichtig

Visual Studio App Center wird am 31. März 2025 eingestellt. Sie können Visual Studio App Center zwar weiterhin verwenden, bis es vollständig eingestellt ist, es gibt jedoch mehrere empfohlene Alternativen, zu denen Sie eine Migration in Betracht ziehen können.

Erfahren Sie mehr über Supportzeitpläne und Alternativen.

Das App Center SDK verwendet eine modulare Architektur, sodass Sie beliebige oder alle Dienste verwenden können.

Beginnen wir mit dem Einrichten von App Center React Native SDK in Ihrer App für die Verwendung von App Center Analytics und App Center-Abstürze.

1. Voraussetzungen

Stellen Sie zunächst sicher, dass die folgenden Voraussetzungen erfüllt sind:

Sie verwenden ein React Native-Projekt, das React Native Version 0.34 oder höher ausgeführt wird.
Sie zielen auf Geräte ab Android-Version 5.0/API-Ebene 21 oder höher oder iOS-Version 9.0 ab.
Sie verwenden keine andere Bibliothek, die Absturzberichterstattungsfunktionen unter iOS bereitstellt.
Für iOS erfordert die Standardart zur Verwendung des SDK CocoaPods. (Wenn Sie CocoaPods nicht installiert haben, befolgen Sie dazu die Erste Schritte CocoaPods). Dennoch ist es möglich, das SDK manuell zu verknüpfen.

2. Erstellen Sie Ihre App im App Center-Portal, um das App-Geheimnis zu erhalten.

Wenn Sie Ihre App bereits im App Center-Portal erstellt haben, können Sie diesen Schritt überspringen.

Wechseln Sie zu appcenter.ms.
Registrieren Sie sich, oder melden Sie sich an, und klicken Sie auf die blaue Schaltfläche in der oberen rechten Ecke des Portals mit dem Namen Neu hinzufügen , und wählen Sie im Dropdownmenü Die Option Neue App hinzufügen aus.
Geben Sie einen Namen und eine optionale Beschreibung für Ihre App ein.
Wählen Sie das entsprechende Betriebssystem (Android oder iOS) und React Native als Plattform aus.
Klicken Sie auf die Schaltfläche unten rechts mit der Bezeichnung Neue App hinzufügen.

Nachdem Sie eine App erstellt haben, können Sie ihr App-Geheimnis auf der Seite Einstellungen im App Center-Portal abrufen. Klicken Sie oben rechts auf der Seite Einstellungen auf die dreifachen vertikalen Punkte , und wählen Sie aus Copy app secret , um Ihr App-Geheimnis abzurufen.

3. Hinzufügen der App Center SDK-Module

Die Standardintegration des SDK verwendet CocoaPods für iOS. Wenn Sie CocoaPods nicht in Ihrer App verwenden, müssen Sie das React Native SDK manuell für Ihre iOS-App integrieren.

Öffnen Sie ein Terminal, navigieren Sie zum Stammverzeichnis Ihres React Native-Projekts, und geben Sie dann die folgende Zeile ein, um der App App App Center Analytics und Abstürze hinzuzufügen:

npm install appcenter appcenter-analytics appcenter-crashes --save-exact

Falls Sie es vorziehen yarnnpm, verwenden Sie den folgenden Befehl, um App Center zu installieren:

yarn add appcenter appcenter-analytics appcenter-crashes --exact

Das App Center SDK verwendet einen modularen Ansatz, bei dem Sie einfach die Module für App Center-Dienste hinzufügen, die Sie verwenden möchten. appcenter-analytics und appcenter-abstürze sind sinnvoll, um fast jeder App hinzuzufügen, da sie einen Mehrwert bieten, ohne dass eine zusätzliche Einrichtung erforderlich ist. appcenter stellt allgemeine App Center-APIs bereit, die für mehrere Dienste nützlich sind.

3.1 Automatische Integration des SDK für React Native 0.60

Die Verwendung des App Center SDK mit React Native kann auf zwei Arten erfolgen: Konfigurieren von AppCenter-Config.plist für iOS und appcenter-config.json für Android oder durch Aufrufen der nativen Startfunktionen, die appSecret als Argument akzeptieren.

3.1.1 Integrieren React Native iOS

Führen Sie pod install --repo-update aus dem iOS-Verzeichnis aus, um CocoaPods-Abhängigkeiten zu installieren.

3.1.1.1 Festlegen von AppSecret Option 1: Konfigurieren `AppCenter-Config.plist`

Erstellen Sie eine neue Datei mit dem Namen AppCenter-Config.plist mit dem folgenden Inhalt, und ersetzen Sie durch {APP_SECRET_VALUE} den Wert Ihres App-Geheimnisses. Vergessen Sie nicht, diese Datei dem Xcode-Projekt hinzuzufügen (klicken Sie mit der rechten Maustaste auf die App in Xcode, und klicken Sie auf Dateien zu <AppName> hinzufügen...).
```
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "https://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
    <dict>
    <key>AppSecret</key>
    <string>{APP_SECRET_VALUE}</string>
    </dict>
</plist>
```

Ändern Sie die AppDelegate.m - oder AppDelegate.mm-Datei , um Code zum Starten des SDK einzuschließen.

Fügen Sie die folgenden Importe hinzu:

#import <AppCenterReactNative.h>
#import <AppCenterReactNativeAnalytics.h>
#import <AppCenterReactNativeCrashes.h>

Fügen Sie der -Methode die application:didFinishLaunchingWithOptions: folgenden Zeilen hinzu:

[AppCenterReactNative register];
[AppCenterReactNativeAnalytics registerWithInitiallyEnabled:true];
[AppCenterReactNativeCrashes registerWithAutomaticProcessing];

3.1.1.2 Festlegen von AppSecret Option 2: Konfigurieren im Code

Ändern Sie die AppDelegate.m - oder AppDelegate.mm-Datei , um Code zum Starten des SDK einzuschließen.

Fügen Sie die folgenden Importe hinzu:

#import <AppCenterReactNativeShared/AppCenterReactNativeShared.h>
#import <AppCenterReactNative.h>
#import <AppCenterReactNativeAnalytics.h>
#import <AppCenterReactNativeCrashes.h>

Fügen Sie der -Methode die application:didFinishLaunchingWithOptions: folgenden Zeilen hinzu:

[AppCenterReactNativeShared setStartAutomatically:YES];
[AppCenterReactNativeShared setAppSecret:@"{Your App Secret}"];
[AppCenterReactNative register];
[AppCenterReactNativeAnalytics registerWithInitiallyEnabled:true];
[AppCenterReactNativeCrashes registerWithAutomaticProcessing];

3.1.2 Integrieren React Native Android

Ändern Sie die res/values/strings.xml der App, um die folgenden Zeilen einzuschließen:

<string name="appCenterCrashes_whenToSendCrashes" moduleConfig="true" translatable="false">DO_NOT_ASK_JAVASCRIPT</string>
<string name="appCenterAnalytics_whenToEnableAnalytics" moduleConfig="true" translatable="false">ALWAYS_SEND</string>

3.1.2.1 Festlegen von AppSecret Option 1: Konfigurieren appcenter-config.json

Erstellen Sie eine neue Datei mit dem Namen appcenter-config.json mit android/app/src/main/assets/ dem folgenden Inhalt, und ersetzen Sie durch {APP_SECRET_VALUE} den Wert Ihres App-Geheimnisses.

{
    "app_secret": "{APP_SECRET_VALUE}"
}

Hinweis: Wenn der Ordner "assets" nicht vorhanden ist, sollte er unter "project_root/android/app/src/Standard/assets" erstellt werden.

3.1.2.2 Festlegen von AppSecret Option 2: Konfigurieren im Code

Fügen Sie die folgende Zeile in der Standard Aktivitätsklasse Ihrer App onCreate-callback hinzu, um App Center Analytics und App Center-Abstürze zu verwenden:

AppCenter.start(getApplication(), "{Your App Secret}", Analytics.class, Crashes.class);

AppCenter.start(application, "{Your App Secret}", Analytics::class.java, Crashes::class.java)

3.2 Automatische Integration des SDK für React Native niedriger als 0.60

Hinweis

Wenn Ihre React Module mithilfe eines relativen Pfads in Ihrer Podfile verknüpft sind, aber nicht im Projekt darauf verwiesen wird, schlägt das Verknüpfungsskript fehl, da es App Center mit statischen Podversionen verknüpft. Sie müssen entweder die Schritte aus dem Abschnitt React Native Problembehandlung ausführen, wenn Sie das Verknüpfungsskript bereits ausgeführt haben, oder es selbst verknüpfen.

Verknüpfen Sie die Plug-Ins mit der React Native App, indem Sie den Befehl react-native link verwenden.
```
react-native link appcenter
react-native link appcenter-analytics
react-native link appcenter-crashes
```
Für iOS wird versucht, das App Center SDK für iOS und macOS von CocoaPods herunterzuladen, wenn ein Fehler wie folgt angezeigt wird:
```
Added code to initialize iOS App Center SDK in ios/reactnativesample/AppDelegate.m
Analyzing dependencies [!] Unable to find a specification for AppCenterReactNativeShared (~> {version}) 
```
Führen Sie den folgenden Befehl aus:
```
pod repo update
```
Versuchen Sie dann erneut, auszuführen react-native link.

Hinweis

Das App Center SDK richtet während des Verknüpfungsprozesses keine automatischen Mocks für App Center-Module ein. Wenn Sie das Jest-Testframework in Ihrer Anwendung verwenden und beim Ausführen von Tests mit Jest Fehler auftreten, die durch das App Center SDK verursacht werden, fügen Sie dem Jest-Abschnitt package.json-Datei Folgendes hinzu (nur verwendete Module enthalten):
```
"setupFiles": [
   "<rootDir>/node_modules/appcenter/test/AppCenterMock.js",
   "<rootDir>/node_modules/appcenter-analytics/test/AppCenterAnalyticsMock.js",
   "<rootDir>/node_modules/appcenter-crashes/test/AppCenterCrashesMock.js",
]
```
Hinweis

Unabhängig davon, ob die Verarbeitung von Abstürze automatisch erfolgt oder durch Javascript-Methoden ausgelöst wird, werden Abstürze immer nach dem Neustart der Anwendung verarbeitet. Abstürze können nicht verarbeitet werden, wenn die Anwendung abstürzt.
Bearbeiten Sie die des android/app/src/main/assets/appcenter-config.json Projekts, und ersetzen Sie den YOUR_APP_SECRET Platzhalterwert durch das Anwendungsgeheimnis Ihres App Center-Projekts.
Bearbeiten Sie die Datei des ios/{YourAppName}/AppCenter-Config.plist Projekts, und ersetzen Sie den YOUR_APP_SECRET Platzhalterwert durch das Anwendungsgeheimnis Ihres App Center-Projekts. Wenn AppCenter-Config.plist bereits vorhanden, aber nicht Teil Ihres Xcode-Projekts ist, müssen Sie es dem Xcode-Projekt manuell hinzufügen (klicken Sie mit der rechten Maustaste auf die App in XCode, und klicken Sie auf Dateien zum <App-Namen> hinzufügen...).

3.3 [nur iOS] Manuelles Integrieren des SDK für React Native ohne react-native Link oder CocoaPods

Führen Sie diese Integration aus, wenn Sie CocoaPods nicht verwenden möchten. Es wird dringend empfohlen, das SDK wie oben beschrieben über CocoaPods zu integrieren. Dennoch ist es auch möglich, das native iOS SDK manuell zu integrieren.

Hinweis

Das neueste App Center React Native SDK ist nicht unbedingt vom neuesten App Center iOS SDK abhängig, da das iOS SDK aktualisiert und vor dem React Native veröffentlicht wird.

Die Folge ist, dass Sie wissen müssen, von welcher Version des iOS SDK das React Native SDK abhängt.

Laden Sie das App Center SDK für React Native Frameworks herunter, die als ZIP-Datei bereitgestellt werden, und entpacken Sie es.
Es wird ein Ordner namens AppCenterReactNativeShared angezeigt, der ein einzelnes Framework für die erforderliche React Native iOS-Brücke enthält.
Laden Sie das entsprechende App Center SDK für iOS-Frameworks herunter, die als ZIP-Datei bereitgestellt werden, und entpacken Sie es.
Es wird ein Ordner namens AppCenter-SDK-Apple/iOS angezeigt, der verschiedene Frameworks für jeden App Center-Dienst enthält. Das Framework namens AppCenter ist im Projekt erforderlich, da es Code enthält, der von den verschiedenen Modulen gemeinsam genutzt wird.
[Optional] Erstellen Sie ein Unterverzeichnis für Drittanbieterbibliotheken.
- Als bewährte Methode befinden sich Drittanbieterbibliotheken in der Regel in einem Unterverzeichnis (es wird häufig als Vendor bezeichnet). Wenn Sie Ihr Projekt also nicht mit einem Unterverzeichnis für Bibliotheken organisiert haben, erstellen Sie jetzt (unter dem Verzeichnis ios Ihres Projekts) ein Unterverzeichnis Vendor.
- Erstellen Sie eine Gruppe namens Vendor in Ihrem Xcode-Projekt, um Ihre Dateistruktur auf dem Datenträger nachzuahmen.
Öffnen Sie den Finder, und kopieren Sie die zuvor entzippten Ordner AppCenter-SDK-Apple/iOS und AppCenterReactNativeShared in den Ordner Ihres Projekts an dem Gewünschten Speicherort.
Fügen Sie dem Projekt in Xcode die SDK-Frameworks hinzu:
- Stellen Sie sicher, dass der Projektnavigator sichtbar ist (-+1).
- Ziehen Sie die Dateien AppCenter.framework, AppCenterAnalytics.framework, AppCenterCrashes.framework und AppCenterReactNativeShared.framework aus dem Finder (am Speicherort aus dem vorherigen Schritt) in den Project Navigator von Xcode. Die Dateien AppCenter.framework und AppCenterReactNativeShared.framework sind erforderlich, um das SDK zu starten. Stellen Sie sicher, dass sie Ihrem Projekt hinzugefügt werden. Andernfalls funktionieren die anderen Module nicht und Ihre App wird nicht kompiliert.
- Es wird ein Dialogfeld angezeigt, stellen Sie sicher, dass Ihr App-Ziel aktiviert ist, und klicken Sie dann auf Fertig stellen.
Verknüpfen Sie AppCenter React Native Plugins-Projekte mit dem Projekt Ihrer App:
- Stellen Sie sicher, dass der Projektnavigator sichtbar ist (-+1).
- Navigieren Sie für jedes AppCenter-React Native-Plug-In zu dem Ordner, der Quellcode enthält. Pfade bzw. Pfade
  - /node_modules/appcenter/ios
  - /node_modules/appcenter-analytics/ios
  - /node_modules/appcenter-crashes/ios
- Ziehen Sie .xcodeproj Dateien aus dem Finder in den Project Navigator von Xcode. In der Regel unter Bibliotheksgruppe .
Verknüpfen von Bibliotheken für AppCenter React Native Plug-Ins. Öffnen Sie Ihre Projekteinstellungen, und fügen Sie auf der Registerkarte Allgemein im Abschnitt Verknüpfte Frameworks und Bibliotheken neue Elemente hinzu, die auf Zielbibliotheken verweisen, die im vorherigen Schritt hinzugefügt wurden:
- libAppCenterReactNative.a
- libAppCenterReactNativeAnalytics.a
- libAppCenterReactNativeCrashes.a
Ändern Sie Header-Suchpfade, um Header aus dem AppCenter-React Native-Plug-In-Projekten zu finden. Öffnen Sie Ihre Projekteinstellungen, und fügen Sie auf der Registerkarte Buildeinstellungen im Abschnitt Headersuchpfade neue Speicherorte für Headerdateien hinzu:

$(SRCROOT)/../node_modules/appcenter/ios/AppCenterReactNative
$(SRCROOT)/../node_modules/appcenter-analytics/ios/AppCenterReactNativeAnalytics
$(SRCROOT)/../node_modules/appcenter-crashes/ios/AppCenterReactNativeCrashes

Ändern Sie die AppDelegate.m- oder AppDelegate.mm-Datei der App so, dass Code zum Starten des SDK enthalten ist:

Fügen Sie die folgenden Importe hinzu:

#import <AppCenterReactNative/AppCenterReactNative.h>
#import <AppCenterReactNativeAnalytics/AppCenterReactNativeAnalytics.h>
#import <AppCenterReactNativeCrashes/AppCenterReactNativeCrashes.h>

Fügen Sie der -Methode diese Zeilen hinzu.application:didFinishLaunchingWithOptions:

[AppCenterReactNative register];
[AppCenterReactNativeAnalytics registerWithInitiallyEnabled:true];
[AppCenterReactNativeCrashes registerWithAutomaticProcessing];

Erstellen Sie eine neue Datei mit dem Namen AppCenter-Config.plist mit dem folgenden Inhalt, und ersetzen Sie durch {APP_SECRET_VALUE} den Wert Ihres App-Geheimnisses. Vergessen Sie nicht, diese Datei dem XCode-Projekt hinzuzufügen (klicken Sie mit der rechten Maustaste auf die App in XCode, und klicken Sie auf Dateien zum <App-Namen> hinzufügen...).
```
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "https://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
    <dict>
    <key>AppSecret</key>
    <string>{APP_SECRET_VALUE}</string>
    </dict>
</plist>
```

Hinweis

Die nächsten beiden Schritte gelten nur für apps, die React Native 0.60 und höher verwenden.

Deaktivieren Sie die automatische Verknüpfung für React Native 0.60 und höher:
- Öffnen Sie im Ordner node_modules in jedem App Center-Paket react-native.config.js, und legen Sie auf nullfestdependency.platforms.ios:
```
module.exports = {
  dependency: {
    platforms: {
      ios: null,
      ...
    }
  }
};
```
Ändern Sie Header-Suchpfade, um React Native Header aus dem App Center React Native Plug-In-Projekten zu finden:
- Stellen Sie sicher, dass der Projektnavigator sichtbar ist (-+1).
- Für jedes AppCenter-React Native-Plug-In-Projekt, das Sie der Gruppe Bibliotheken in Schritt 8 hinzugefügt haben:
  - Wählen Sie das Projekt aus, und fügen Sie auf der Registerkarte Buildeinstellungen im Abschnitt Headersuchpfade neue Speicherorte für Headerdateien mit einer Option hinzu recursive : ${SRCROOT}/../../../ios/Pods/Headers

3.4 [Nur Android] Manuelle Integration des SDK für React Native unter 0,60 ohne react-native Link

Integrationsschritte ohne den react-native link Befehl.

Öffnen Sie die Datei android/settings.gradle , und fügen Sie die folgenden Zeilen ein. Fügen Sie die Gewünschten Abhängigkeiten in Ihr Projekt ein. Jedes SDK-Modul muss in diesem Abschnitt als separate Abhängigkeit hinzugefügt werden. Wenn Sie App Center Analytics und Abstürze verwenden möchten, fügen Sie die folgenden Zeilen hinzu:

  include ':appcenter-crashes'
  project(':appcenter-crashes').projectDir = new File(rootProject.projectDir, '../node_modules/appcenter-crashes/android')
  include ':appcenter-analytics'
  project(':appcenter-analytics').projectDir = new File(rootProject.projectDir, '../node_modules/appcenter-analytics/android')
  include ':appcenter'
  project(':appcenter').projectDir = new File(rootProject.projectDir, '../node_modules/appcenter/android')

Hinweis

Aufgrund der Beendigung der jCenter-Unterstützung wurden alle unsere Assemblys in das Maven Central-Repository verschoben. Befolgen Sie diesen Leitfaden zur Migration von jCenter zu Maven Central.

Öffnen Sie die Datei build.gradle () auf App-Ebene des Projekts,android/app/build.gradle und fügen Sie dem Abschnitt die folgenden Zeilen hinzu dependencies :

dependencies {
    implementation project(':appcenter-crashes')
    implementation project(':appcenter-analytics')
    implementation project(':appcenter')
    ...
}

Ändern Sie die MainApplication.java-Datei der App so, dass Code zum Starten des SDK enthalten ist:

Hinzufügen dieser Zeilen zum Importabschnitt

import com.microsoft.appcenter.reactnative.crashes.AppCenterReactNativeCrashesPackage;
import com.microsoft.appcenter.reactnative.analytics.AppCenterReactNativeAnalyticsPackage;
import com.microsoft.appcenter.reactnative.appcenter.AppCenterReactNativePackage;

Hinzufügen von AppCenter-Paketen zur List<ReactPackage> getPackages() -Methode

@Override
protected List<ReactPackage> getPackages() {
  return Arrays.<ReactPackage>asList(
      new MainReactPackage(),
        new AppCenterReactNativeCrashesPackage(MainApplication.this, getResources().getString(R.string.appCenterCrashes_whenToSendCrashes)),
        new AppCenterReactNativeAnalyticsPackage(MainApplication.this, getResources().getString(R.string.appCenterAnalytics_whenToEnableAnalytics)),
        new AppCenterReactNativePackage(MainApplication.this)
  );
}

Öffnen Sie strings.xml Datei (android/app/src/main/res/values), und fügen Sie die folgenden Zeilen in <resources></resources> Tags hinzu:

<string name="appCenterAnalytics_whenToEnableAnalytics" moduleConfig="true" translatable="false">ALWAYS_SEND</string>
<string name="appCenterCrashes_whenToSendCrashes" moduleConfig="true" translatable="false">DO_NOT_ASK_JAVASCRIPT</string>

Erstellen Sie eine neue Datei mit dem Namen appcenter-config.json durch android/app/src/main/assets/ den folgenden Inhalt, und ersetzen Sie durch APP_SECRET_VALUE den Wert Ihres App-Geheimnisses.
```
{
    "app_secret": "APP_SECRET_VALUE"
}
```

Warnung

Es wird nicht empfohlen, Ihr App-Geheimnis in den Quellcode einzubetten.

3.5 Wenn Sie die automatische Sicherung verwenden, um falsche Informationen zum Gerät zu vermeiden, führen Sie die nächsten Schritte aus:

Hinweis

Für Apps mit Android 6.0 (API-Ebene 23) oder höher ist die automatische Sicherung automatisch aktiviert.

Hinweis

Wenn Sie bereits über eine benutzerdefinierte Datei mit Sicherungsregel verfügen, wechseln Sie zum dritten Schritt.

a. Erstellen Sie appcenter_backup_rule.xml Datei im Ordner android/app/src/Standard/res/xml.

b. Öffnen Sie die AndroidManifest.xml Datei des Projekts. Fügen Sie dem -Element das android:fullBackupContent<application> -Attribut hinzu. Es sollte auf die appcenter_backup_rule.xml-Ressourcendatei verweisen.

android:fullBackupContent="@xml/appcenter_backup_rule"

c. Fügen Sie der dateiappcenter_backup_rule.xml die folgenden Sicherungsregeln hinzu:

<full-backup-content xmlns:tools="http://schemas.android.com/tools">
    <exclude domain="sharedpref" path="AppCenter.xml"/>
    <exclude domain="database" path="com.microsoft.appcenter.persistence"/>
    <exclude domain="database" path="com.microsoft.appcenter.persistence-journal"/>
    <exclude domain="file" path="error" tools:ignore="FullBackupContent"/>
    <exclude domain="file" path="appcenter" tools:ignore="FullBackupContent"/>
</full-backup-content>

4. Starten des SDK

Jetzt können Sie Ihre Anwendung entweder über die Befehlszeile oder über Xcode/Android Studio erstellen und starten.

4.1 Erstellen und Ausführen Ihrer Anwendung über die Befehlszeile

Sie können Ihre iOS-Anwendung mit dem folgenden Befehl erstellen und starten:

react-native run-ios

Tipp

Sie können es auf einem iOS-Simulator oder iOS-Gerät starten, indem Sie den iOS-Gerätenamen in react-native run-ios --device "myDeviceName"angeben.

Sie können Ihre Android-Anwendung mit dem folgenden Befehl erstellen und starten:

react-native run-android

Tipp

Sie können es auf einem Android-Emulator oder Android-Gerät starten, indem Sie die Geräte-ID in react-native run-android --deviceId "myDeviceId" (deviceId über adb devices den Befehl) angeben.

4.2 Erstellen und Ausführen Ihrer Anwendung über Xcode oder Android Studio

Öffnen Sie für iOS die ios/{appname}.xcworkspace Projekt- oder ios/{appname}.xcodeproj Datei in Xcode, und erstellen Sie von dort aus.

Hinweis

Wenn Sie App Center automatisch über react-native link verknüpft haben (wie in Schritt 3.1), sollten Sie die Projektdatei ios/{appname}.xcworkspace in Xcode öffnen. Da App Center CocoaPods-Abhängigkeiten nur mit xcworkspace nicht xcodeprojfunktionieren und die ios/{appname}.xcodeproj App Center CocoaPods-Abhängigkeiten nicht verknüpft sind.

Für Android importieren Sie Ihr Android-Projekt in Android Studio, und erstellen Sie von dort aus.

Sie sind alle darauf eingestellt, Analyse- und Absturzdaten im Portal zu visualisieren, die das SDK automatisch erfasst. Es ist kein zusätzliches Setup erforderlich. Im Abschnitt Analyse und Abstürze finden Sie APIs-Leitfäden und exemplarische Vorgehensweisen, um zu erfahren, was App Center leisten kann.

Erste Schritte mit React Native

1. Voraussetzungen

2. Erstellen Sie Ihre App im App Center-Portal, um das App-Geheimnis zu erhalten.

3. Hinzufügen der App Center SDK-Module

3.1 Automatische Integration des SDK für React Native 0.60

3.1.1 Integrieren React Native iOS

3.1.1.1 Festlegen von AppSecret Option 1: Konfigurieren AppCenter-Config.plist

3.1.1.2 Festlegen von AppSecret Option 2: Konfigurieren im Code

3.1.2 Integrieren React Native Android

3.1.2.1 Festlegen von AppSecret Option 1: Konfigurieren appcenter-config.json

3.1.2.2 Festlegen von AppSecret Option 2: Konfigurieren im Code

3.2 Automatische Integration des SDK für React Native niedriger als 0.60

3.3 [nur iOS] Manuelles Integrieren des SDK für React Native ohne react-native Link oder CocoaPods

3.4 [Nur Android] Manuelle Integration des SDK für React Native unter 0,60 ohne react-native Link

3.5 Wenn Sie die automatische Sicherung verwenden, um falsche Informationen zum Gerät zu vermeiden, führen Sie die nächsten Schritte aus:

4. Starten des SDK

4.1 Erstellen und Ausführen Ihrer Anwendung über die Befehlszeile

4.2 Erstellen und Ausführen Ihrer Anwendung über Xcode oder Android Studio

Zusätzliche Ressourcen

3.1.1.1 Festlegen von AppSecret Option 1: Konfigurieren `AppCenter-Config.plist`