本文主要介绍React Native项目接入Sentry流程，以及遇到的一些注意点，方便大家去解决和处理，如果在接入过程中，遇到任何问题可以在评论区留言，我将根据自己的接入经验给出一些解决方案和建议，另外，本文还涉及到react native sentry sourcemap上传相关的注意点以及细节。
1.项目根目录安装sentry sdk
执行如下命令：
yarn sentry-wizard -s -i reactNative
或者
npx @sentry/wizard -s -i reactNative
这是react native官方接入文档：docs.sentry.io/platforms/r…
如果比较顺利，那么执行完上述命令后，基本不要动就可以直接测试异常上报等功能，前端代码这样写：
import * as Sentry from "@sentry/react-native";
Sentry.init({
dsn: "https://6701a142b36c4098b88385bebf702fbd@o4504790585835520.ingest.sentry.io/4504790600450048",
// Set tracesSampleRate to 1.0 to capture 100%
// of transactions for performance monitoring.
// We recommend adjusting this value in production
tracesSampleRate: 1.0,
});
但是如果你无脑这样接入的话，大概率会遇到不少问题，特别是老项目的话，因为它默认安装的是最新版的sentry sdk，对react native的版本有要求，如果项目中使用的是低版本的react sdk，比如0.62.2等，现在最新的react sdk 好像已经到了0.71.x。
如果你说我可以升级react native sdk到最新版本，那么这可不是一项小工程，可能会遇到更多的问题，可能是兼容性的问题，可能是各种三方库的版本问题，总之，升级react sdk是一个要仔细考虑的问题，如果你坚持要升级，可以借助react-native-upgrade-helper工具进行对比修改，要细心也要时间。
那么如何在不更改react native版本的情况下，正确安装sentry sdk呢，那么必然需要找到对应项目react native sdk版本的sentry sdk，可以点击sentry sdk发布列表查看对应的历史版本：
然后可以点击某个版本，即可看到要求的react native 版本：
然后继续往下翻，会看到具体的安装集成步骤，上图右上角Install栏目下也有安装此版本的命令，直接项目根目录命令行下执行即可。
此时大概率可以成功安装sentry sdk，但也不排除会遇到一些网络问题，记得科学上网，或者切换不同的wifi尝试，不要死等，一旦卡住就果断ctrl+c停止，然后重新执行，安装以上步骤基本上可以就成功集成到项目中了。
如果ios运行项目有问题，记得前往ios目录下执行pod install，然后再次尝试安装，如果还不行可以执行pod repo update尝试，再不行直接google错误日志，寻找解决方案。
2.集成source map
集成的目的是为了更方便的收集线上的问题，但是当你集成完毕，打包测试，确实会上报一些错误和异常，但是有些问题却无法定位比较准确，如下图所示：
此时就需要集成sentry的source map功能。
“Source Map”（源代码映射）是一种文件格式，通常用于调试JavaScript、CSS和其他代码，它将编译后的代码映射回原始源代码，从而使得调试更加容易。源代码映射可以帮助开发人员在开发和调试过程中定位错误和问题，尤其是在使用了压缩和混淆工具的情况下。
集成source map可以使错误定位更加精确，可以具体到报错的文件以及具体位置，真是太香了，者必须得集成啊。
于是，打开sentry官方文档，发现好像不难，只需要两步，第一步生成对应的.map文件，第二步上传到sentry平台即可。
1.生成map文件
官方给的命令是：
Android:
react-native bundle \ --dev false \ --platform android \ --entry-file index.android.js \ --reset-cache \ --bundle-output index.android.bundle \ --sourcemap-output index.android.bundle.map
ios:
react-native bundle \ --dev false \ --platform ios \ --entry-file index.ios.js \ --reset-cache \ --bundle-output main.jsbundle \ --sourcemap-output main.jsbundle.map
直接执行可能会找不到index.android.js文件，这里需要修改为自己的项目入口文件，比如你的项目入口文件是index.js，只需要替换index.android.js为index.js即可，然后项目根目录下执行此命令，就会在项目根目录下生成index.android.bundle和index.android.bundle.map文件，那么这一步就算完成了。
2.上传source Map到sentry平台
这个步骤看似也不难，此处介绍使用sentry-cli工具进行上传，如果你还没有安装sentry-cli，执行如下命令全局安装：
npm install -g @sentry/cli
配置登录sentry-cli，配置Server Url,ORG,Project名称，这几项比较重要，要如实配置，不然上传的时候会显示Project not found，Server Url就是你的sentry网站地址，ORG是组织的名字，可以在Organization Settings -> Display Name处查看，project名字就是你创建的项目名字，然后执行如下命令
export SENTRY_URL=http://xxxx:8012/
export SENTRY_ORG=sentry-org
export SENTRY_PROJECT=rn-app
下面要先执行sentry-cli login登录配置sentry的auth token，以便调用上传：
此时会引导你获取Auth token,如下图，没有可以点击右上角的按钮创建一个：
执行sentry-cli info命令来查看当前配置信息：
安装成功后，查看官方文档source map的上传命令如下：
Android：
node_modules/@sentry/cli/bin/sentry-cli releases \ files <release> \ upload-sourcemaps \ --dist <dist> \ --strip-prefix $projectRoot/fullFolder \ --bundle index.android.bundle \ --bundle-sourcemap index.android.bundle.map
ios:
node_modules/@sentry/cli/bin/sentry-cli releases \ files <release> \ upload-sourcemaps \ --dist <dist> \ --strip-prefix $projectRoot/fullFolder \ --bundle main.jsbundle \ --bundle-sourcemap main.jsbundle.map
重点介绍一下几个参数，files填写规则可以是应用包名@版本号+版本号的数字组合，比如应用包名是com.test.demo，版本号是1.1.0，那么files可以填：com.test.demo@1.1.0+110，dist参数类似于版本的含义，每次上传可以+1,strip-prefix可以给个字符串前缀，这是我目前知道的。
上传示例：
sentry-cli releases \
files com.test.demo@1.1.0+110 \
upload-sourcemaps \
--dist 1 \
--strip-prefix ‘test’ \
--bundle index.android.bundle \
--bundle-sourcemap index.android.bundle.map
到这里基本上生成source map和上传功能已经完成了，直接执行如上命令，就可以把source map对应的文件上传的sentry平台，但是如果此时你继续测试，发现定位的依然不准确，查看具体报错位置会有如下提醒：
提示也很明显，需要在sentry init的时候去配置sourceMap的dist和release，那么根据提示在init的时候加上即可，示例如下：
记上这两行，dist对应于source map上传时候配置的值，release对于files下传递的那一串，此时再次收集的错误就比较详细了：
3.注意事项
ios端上传注意修改files参数，命令基本上和android大同小异，根据官方文档修改参数执行命令即可。
注意url,org,project要配置正确，不然upload的时候会报project not found的错误。
