Sentry 官方 JavaScript SDK 简介与调试指南

简介: Sentry 官方 JavaScript SDK 简介与调试指南

支持的平台



对于每个主要的 JavaScript 平台,都有一个特定的高阶 SDK,可以在单个包中提供您需要的所有工具。有关更多详细信息,请参阅这些 SDK 的 README 和说明:


  • @sentry/browser: 浏览器的 SDK,包括对基础主干(GlobalHandlers, TryCatch, Breadcrumbs, LinkedErrors, UserAgent, Dedupe)的集成。
  • @sentry/node: 适用于 NodeSDK,包括 ExpressKoaLoopbackSailsConnect 的集成。
  • @sentry/angular: 启用 Angular 集成的浏览器 SDK
  • @sentry/react: 启用 React 集成的浏览器 SDK
  • @sentry/ember: 启用 Ember 集成的浏览器 SDK
  • @sentry/vue: 启用 Vue 集成的浏览器 SDK
  • @sentry/gatsby: GatsbySDK
  • @sentry/nextjs: Next.jsSDK
  • @sentry/integrations: 可用于增强 JS SDK 的可插拔集成。
  • @sentry/electron: 支持原生崩溃的 Electron SDK
  • @sentry/react-native: 支持原生崩溃的 React Native SDK
  • @sentry/capacitor:支持原生崩溃的 Capacitor AppIonicSDK
  • sentry-cordova:支持原生崩溃的 Cordova AppSDK
  • raven-js:旧的稳定 JavaScript SDK,我们仍然支持并发布 SDK 的错误修复,但所有新功能都将在 @sentry/browser 中实现,它是继任者。
  • raven:旧的稳定 Node SDK,与 raven-js 一样,我们仍然支持并发布 SDK 的错误修复,但所有新功能都将在 @sentry/node 中实现,它是继任者。


用于平台 SDK 开发的共享软件包



  • @sentry/tracing: 为性能监控/跟踪提供集成扩展
  • @sentry/hub: SDK 的全局状态管理。
  • @sentry/minimal: Sentry 支持的最小 SDK
  • @sentry/core: 具有接口类型定义类的所有 JavaScript SDK 的基础。
  • @sentry/utils: 一组对各种 SDK 有用的辅助程序和实用函数。
  • @sentry/types: 所有软件包中使用的类型定义。


开发调试



设置环境


要运行 test suitecode linter,需要 node.jsyarn



sentry-javascript 是一个包含多个软件包的 monorepo,使用 lerna 管理它们。首先,安装所有依赖项,使用 lerna 引导工作区,然后执行初始构建,以便 TypeScript 可以读取所有链接的类型定义。


yarn
yarn lerna bootstrap
yarn build


这样,repo 就完全设置好了,您可以运行所有命令了。


构建软件包


由于我们使用的是 TypeScript,因此您需要将代码转换为 JavaScript 才能使用它。来自 repo 的顶层,有三个可用命令:


  • yarn build:dev,它运行每个包的 ES5ES6 版本的一次性构建。
  • yarn build:dev:filter <name of npm package>,它只在与给定包相关的项目中运行 yarn build:dev(例如,运行 yarn build:dev:filter @sentry/react 将构建 react 包、它的所有依赖项(utilscorebrowser 等),以及所有依赖它的包(目前是 gatsbynextjs))。
  • yarn build:dev:watch,在 watch 模式下运行 yarn build:dev(推荐)


添加测试


任何重要的修复/功能都应该包括测试。您会在每个软件包中找到一个 test 文件夹。

请注意,仅对于 browser 包,如果您将新文件添加到集成测试套件中,您还需要将其添加到shell.js 中的列表中。在所有包中,向现有文件添加测试都可以开箱即用。


运行测试


运行测试与构建的工作方式相同 - 在项目根目录运行 yarn test 将对所有包运行测试,在特定包中运行 yarn test 将为该包运行测试。还有一些命令可以在每个位置运行测试的子集。查看相应 package.jsonscripts 条目以了解详细信息。

注意:你必须在 yarn test 工作之前运行 yarn build


调试测试


如果您在编写测试时遇到麻烦并需要调试其中之一,您可以使用 VSCodedebugger 来完成。


如果您尚未安装它,请安装 Tasks Shell Input 扩展,您可以在侧边栏的“扩展”选项卡中找到它作为推荐的工作区扩展之一。


  1. 将断点或 debugger 语句放置在测试或底层代码中您希望 jest 暂停的任何位置。
  2. 打开包含相关测试的文件,并确保其选项卡处于活动状态(以便您可以看到文件的内容)。
  3. 切换到侧边栏中的 debugger,然后从下拉列表中选择 Debug unit tests - just open file
  4. 单击绿色的 “play” 按钮以 watch 模式在打开的文件中运行测试。


实战


测试代码:


微信图片_20220613002817.jpg


专业提示:如果您的任何断点在由多个测试运行的代码中,并且您运行整个测试文件,您将在不关心的测试中间一遍又一遍地停留在这些断点上。为避免这种情况,请将测试的初始 ittest 替换为 it.onlytest.only。这样,当您遇到断点时,您就会知道您到达了有问题的测试的一部分。


Linting


与构建和测试类似,linting 可以通过调用 yarn lint 在项目根目录或单个包中完成。


注意:你必须在 yarn lint 工作之前运行 yarn build

相关文章
|
2月前
|
开发工具
使用FFmpeg4.3.1的SDK官方开发包编译ffmpeg.c(三)
使用FFmpeg4.3.1的SDK官方开发包编译ffmpeg.c(三)
57 0
|
8月前
|
JavaScript
Sublime Text3 直接运行js调试控制台
Sublime Text3 直接运行js调试控制台
148 0
|
1月前
|
JavaScript 前端开发 开发者
介绍如何在WebStorm中调试JavaScript文件
介绍如何在WebStorm中调试JavaScript文件
20 1
|
23天前
|
JavaScript
js 调试 —— 断点(含进入函数、条件断点等)
js 调试 —— 断点(含进入函数、条件断点等)
25 0
|
24天前
|
Web App开发 JavaScript 前端开发
js 调试—— 【控制台】debugger语句 、 命令行API
js 调试—— 【控制台】debugger语句 、 命令行API
22 0
|
24天前
|
JavaScript 前端开发 测试技术
js 控制台调试——console 对象【详解】
js 控制台调试——console 对象【详解】
20 0
|
24天前
|
Web App开发 前端开发 JavaScript
|
25天前
|
PHP 开发工具
tp5+微信公众号服务器配置时使用官方sdk还是token验证失败
tp5+微信公众号服务器配置时使用官方sdk还是token验证失败
16 0
|
2月前
|
监控 前端开发 JavaScript
如何在浏览器中使用javaScript进行代码调试
【4月更文挑战第11天】在浏览器中调试JavaScript是前端开发的关键技能。使用开发者工具(可通过F12、右键检查或菜单栏访问),遵循以下步骤:1) 打开Sources标签页查看所有脚本;2) 设置断点在需要暂停的代码行;3) 刷新页面触发断点;4) 利用调试工具如Scopes、Watch、Call Stack等检查代码状态;5) 使用Console辅助调试;6) 利用其他工具如Network、Performance和Memory进行性能分析。确保使用最新工具,保持代码清晰,以提升调试效率。
328 4
|
2月前
|
机器学习/深度学习 文字识别 开发工具
视觉智能平台常见问题之sdk调试报401错如何解决
视觉智能平台是利用机器学习和图像处理技术,提供图像识别、视频分析等智能视觉服务的平台;本合集针对该平台在使用中遇到的常见问题进行了收集和解答,以帮助开发者和企业用户在整合和部署视觉智能解决方案时,能够更快地定位问题并找到有效的解决策略。
视觉智能平台常见问题之sdk调试报401错如何解决