Debugowanie wersji produkcyjnych

Nieoficjalne Tłumaczenie Beta

Ta strona została przetłumaczona przez PageTurner AI (beta). Nie jest oficjalnie zatwierdzona przez projekt. Znalazłeś błąd? Zgłoś problem →

Symbolikacja śladu stosu

Jeśli aplikacja React Native zgłosi nieobsłużony wyjątek w wersji produkcyjnej, wynik może być nieczytelny i zniekształcony.

shell

07-15 10:58:25.820 18979 18998 E AndroidRuntime: FATAL EXCEPTION: mqt_native_modules
07-15 10:58:25.820 18979 18998 E AndroidRuntime: Process: com.awesomeproject, PID: 18979 07-15 10:58:25.820 18979 18998 E AndroidRuntime: com.facebook.react.common.JavascriptException: Failed, js engine: hermes, stack:
07-15 10:58:25.820 18979 18998 E AndroidRuntime: p@1:132161
07-15 10:58:25.820 18979 18998 E AndroidRuntime: p@1:132084
07-15 10:58:25.820 18979 18998 E AndroidRuntime: f@1:131854
07-15 10:58:25.820 18979 18998 E AndroidRuntime: anonymous@1:131119

W powyższym śladzie stosu wpisy takie jak p@1:132161 reprezentują zminifikowane nazwy funkcji i przesunięcia bajtkodu. Aby debugować te wywołania, musimy przekształcić je w format plik:linia:nazwa_funkcji, np. AwesomeProject/App.js:54:initializeMap. Proces ten nazywamy symbolikacją.

Można przeprowadzić symbolikację zminifikowanych nazw funkcji i bajtkodu, takich jak powyższe, przekazując ślad stosu i wygenerowaną mapę źródłową do narzędzia metro-symbolicate.

Włączanie map źródłowych

Mapy źródłowe są niezbędne do symbolikacji śladów stosu. Upewnij się, że są włączone w konfiguracji budowania dla docelowej platformy.

Android

informacja

On Android, source maps are enabled by default.

To enable source map generation, ensure the following hermesFlags are present in android/app/build.gradle.

groovy

react {
    hermesFlags = ["-O", "-output-source-map"]
}

If done correctly you should see the output location of the source map during Metro build output.

text

Writing bundle output to:, android/app/build/generated/assets/react/release/index.android.bundle
Writing sourcemap output to:, android/app/build/intermediates/sourcemaps/react/release/index.android.bundle.packager.map

iOS

informacja

On iOS, source maps are disabled by default. Use the following instructions to enable them.

To enable source map generation:

• Open Xcode and edit the build phase "Bundle React Native code and images".
• Above the other exports, add a SOURCEMAP_FILE entry with the desired output path.

diff

+ export SOURCEMAP_FILE="$(pwd)/../main.jsbundle.map"
  WITH_ENVIRONMENT="../node_modules/react-native/scripts/xcode/with-environment.sh"

If done correctly you should see the output location of the source map during Metro build output.

text

Writing bundle output to:, Build/Intermediates.noindex/ArchiveIntermediates/application/BuildProductsPath/Release-iphoneos/main.jsbundle
Writing sourcemap output to:, Build/Intermediates.noindex/ArchiveIntermediates/application/BuildProductsPath/Release-iphoneos/main.jsbundle.map

Korzystanie z metro-symbolicate

Gdy mapy źródłowe są generowane, możemy przekształcać nasze ślady stosu.

shell

# Print usage instructions
npx metro-symbolicate

# From a file containing the stack trace
npx metro-symbolicate android/app/build/generated/sourcemaps/react/release/index.android.bundle.map < stacktrace.txt

# From adb logcat (Android)
adb logcat -d | npx metro-symbolicate android/app/build/generated/sourcemaps/react/release/index.android.bundle.map

Uwagi dotyczące map źródłowych

• Proces budowania może generować wiele map źródłowych. Używaj tej wskazanej w lokalizacji pokazanej w przykładach.

• Upewnij się, że użyta mapa źródłowa odpowiada dokładnie tej wersji aplikacji, która uległa awarii. Drobne zmiany w kodzie mogą znacząco wpłynąć na przesunięcia.

• Jeśli metro-symbolicate zakończy działanie natychmiast bez błędów, sprawdź czy dane wejściowe pochodzą z potoku lub przekierowania, a nie bezpośrednio z terminala.