如何从 firebase crashlytics 堆栈跟踪文本 index.android.bundle 或 iOS main.jsbundle 获取错误源文件？

Question

如何从指向index.android.bundle:474:6500的crashlytics堆栈跟踪行获取源文件行和列信息？

crashlytics 报告堆栈跟踪文本类似于：

Non-fatal Exception: io.invertase.firebase.crashlytics.UnhandledPromiseRejection: undefined is not an object (evaluating 't.includes')
       at .removeFile(index.android.bundle:474:6500)
       at .<unknown>(index.android.bundle:758:3472)
       at .y(index.android.bundle:105:596)
       at .<unknown>(index.android.bundle:105:2546)
       at .y(index.android.bundle:105:596)
       at .o(index.android.bundle:105:1483)
       at .<unknown>(index.android.bundle:105:1626)
       at .f(index.android.bundle:101:155)
       at .<unknown>(index.android.bundle:101:1012)
       at .y(index.android.bundle:107:657)
       at .C(index.android.bundle:107:1021)
       at .callImmediates(index.android.bundle:107:3216)
       at .callImmediates([native code]:0:0)
       at .value(index.android.bundle:25:3080)
       at .<unknown>(index.android.bundle:25:1264)
       at .value(index.android.bundle:25:2772)
       at .value(index.android.bundle:25:1234)
       at .value([native code]:0:0)
       at .value([native code]:0:0)

我尝试了堆栈美化器，但效果有限。有没有更靠谱的方法呢？

Answer 1

我花了几天时间试图找出一个好的解决方案。这是迄今为止我发现的最好的。

1) 从 Git 标签构建源映射或提交与 Crashlytics 报告中的版本相对应的哈希

iOS系统

react-native bundle --platform ios --entry-file index.js --dev false --reset-cache --bundle-output /tmp/bundle.ios.js --assets-dest /tmp/ --sourcemap-output sourcemap.ios.js.map

Android 从 build gradle 自动构建

// https://github.com/facebook/react-native/issues/7393
// /sf/ask/2430057451/
project.ext.react = [
    entryFile: "index.js",
    enableHermes: false,  // clean and rebuild if changing    
    extraPackagerArgs: ["--sourcemap-output", 
    file("$buildDir/../../../sourcemap.android.js.map")]
]

或者手动构建：

react-native bundle --platform android --entry-file index.js --dev false --reset-cache --bundle-output /tmp/bundle.android.js --assets-dest /tmp/ --sourcemap-output sourcemap.android.js.map

2）使用metro-symbolicate

1. 在Google Firebase 控制台中打开崩溃报告

2. 选择堆栈跟踪选项卡

3. 选择TXT选项卡并将文本保存到名为 mytrace.txt 的文件中

4. 删除以包含“ [native code] ”的第一行开头的所有堆栈跟踪行，因为“ [native code] ”似乎会导致问题

5. 结果示例：错误源自 Utility.js:567

npx metro-symbolicate sourcemap.android.js < fs-27-stack-trace.txt                                                                 
Non-fatal Exception: io.invertase.firebase.crashlytics.UnhandledPromiseRejection: undefined is not an object (evaluating 't.includes')
       at .removeFile(/Users/eddie/Documents/projects/react-native/my-react-native-app/v1.6.1146/source/app/components/Utility.js:567:includes)
       at .<unknown>(/Users/eddie/Documents/projects/react-native/my-react-native-app/v1.6.1146/source/app/components/software-downloader/DownloadClient.js:237:oldVersion)

我希望这可以帮助其他人。