带有 Sentry 的 Vue CLI 3 - 如何使用 Vue 的 config.errorHandler？

【问题标题】：Vue CLI 3 with Sentry - How to use Vue's config.errorHandler?带有 Sentry 的 Vue CLI 3 - 如何使用 Vue 的 config.errorHandler？
【发布时间】：2018-11-14 12:15:59
【问题描述】：

如何将Vue's config.errorHandler 与Sentry for Vue 结合使用？

我想在应用程序中捕获除 Sentry 之外的错误，但是一旦我实现 config.errorHandler，我就会覆盖 Sentry 实现。

main.js：

import * as Sentry from "@sentry/browser";

Sentry.init({
  dsn: "my dsn",
  integrations: [new Sentry.Integrations.Vue({ Vue })]
});

// This prevents sentry from being used
Vue.config.errorHandler = (msg, vm , info) => {
  alert(info)
}

【问题讨论】：

您是否尝试在自定义代码后在errorHandler 末尾抛出错误？ throw msg，就你而言。
@aBiscuit 是的，结果相同。

标签： javascript vue.js error-handling sentry

【解决方案1】：

当 Sentry 覆盖 Vue.config.errorHandler 时，它会保存对先前声明的 errorHandler 的引用，并在 Sentry 处理错误后调用它。 source

在这种情况下，应在将Vue 构造函数传递给new Sentry.Integrations.Vue({ Vue }) 之前声明自定义errorHandler。

对于上面的代码示例，只需切换自定义errorHandler 和Sentry.init() 的顺序即可解决问题。

import * as Sentry from "@sentry/browser";    

Vue.config.errorHandler = (msg, vm , info) => {
  alert(info)
}

Sentry.init({
  dsn: "my dsn",
  integrations: [new Sentry.Integrations.Vue({ Vue })]
});

【讨论】：