一、前言
如果是Spa、Mpa的项目引入sentry会比较简单，但是如果是一个微前端架构或者Monorepo项目引入sentry就需要一点的技巧性了，否则多项目之间的source map会比较麻烦。
先说下简单的项目如何引入Sentry服务，先来看一次简单的error信息，是如何捕捉，最后呈现给用户的。
先看下图：
上图总结下，就是三步
- 浏览器产生error，然后被sentry客户端捕捉到
- 上传到sentry服务器
- 服务器解析错误，通过source map定位错误，最终呈现给用户的信息就如下所示了
这是普通项目的sentry引入方式，如果是Monorepo的话，这种方式就不行了，在一些大型应用服务中，一个域下会有很多项目，如果每个项目都需要创建一个sentry project，那就太麻烦了。
举个具体的例子：
比如在一个www.xxx.com域名下，有www.xxx.com/project-a/x.html、www.xxx.com/project-b/x.html两个项目，因为是在一个域下，这种情况如果用传统的sentry部署方式，就意味着每个项目都需要创建一个项目，这样就太太麻烦了。
有没有办法，可以用一个sentry项目，去管理同个域下的Monorepo项目尼？仔细阅读了sentry-cli的文档，应该是可以的。
二、实现方案
按照上图的sentry解析error的步骤，可以得知核心在于如何把error和sourcemap关联，只有关联了，sentry收集到的error才具有意义。
sentry-cli文档中有两个参数很重要，release、urlPrefix。
- release负责每次发布的版本号，client和server的关联就靠这个了
- urlPrefix正好可以用来解决Monorepo项目在一个sentry project下部署的问题
通过上图，重新把流程进行了梳理
- 通过自定义的方式生成每个项目的release信息，代码路径： script/genBuildRelease.js，生成的代码如下
- 基于sentry-cli把release上传到server中，代码路径：script/uploadSourceMap.js
- 在build代码时，把release信息注入到源码中，代码路径：libs/common/src/lib/sentry.ts
- 捕捉到error后，通过release发送到服务端
- Sentry server收集到信息之后，通过release进行sourcemap关联，解析对应的错误
至此Monorepo的部署sentry的方案就结束了
三、github demo
如果觉得还有一些迷迷糊糊的地方的话，以上的Nx部署sentry的代码，都已经上传到了github，有兴趣的可以下载下来，跑下就明白了
