開啟 Stackblitz 並試用看看。

效能目前已停用！

https://github.com/JulianMar/nuxt-bugsnag/issues/80

設定

將 nuxt-bugsnag 依賴項新增至您的專案

npx nuxi@latest module add bugsnag

將 nuxt-bugsnag 新增至 nuxt.config.js 的 modules 區段。

{
  modules: [
    'nuxt-bugsnag'
  ]
}

您可以在組態物件中傳遞所有 bugsnag 選項

{
  bugsnag: {
    config: {
      apiKey: 'your key',
      enabledReleaseStages: ['staging', 'production'],
    }
  }
}

原始碼對應表

您可以透過新增 publishRelease 選項來上傳原始碼對應表。設定 baseUrl 也非常重要，這能讓 bugsnag 將您的錯誤對應到原始碼對應表

{
  bugsnag: {
    publishRelease: true,
    baseUrl: 'https://127.0.0.1:3000'
  }
}

中型 Nuxt 應用程式的輸出可能會變得相當大。因此我們新增了一個選項來停用這種情況下的日誌。

{
  bugsnag: {
    publishRelease: true,
    disableLog: true,
    baseUrl: 'https://127.0.0.1:3000'
  }
}

設定不同的專案根目錄

如果您的 Nuxt 應用程式在與 / 不同的資料夾中執行，您可能需要將 projectRoot 設定為此目錄，以便 BugSnag 可以比對原始碼對應表。

{
  bugsnag: {
    publishRelease: true,
    projectRoot: '/someFolder/'
  }
}

組態範例

我建議設定這些選項

{
  modules: [
    'nuxt-bugsnag',
  ],

  bugsnag: {
    publishRelease: true,
    config: {
      apiKey: 'YOUR_API_KEY',
      enabledReleaseStages: ['staging', 'production'],
      releaseStage: process.env.NODE_ENV,
      appVersion: 'YOUR_VERSION',
    }
  }
}

回報自訂錯誤

最簡單的答案是這樣。

this.$bugsnag.notify(new Error('Some Error'))

如果您喜歡組合式方法，您可以這樣做

useBugsnag().notify('Some Error')

效能

僅適用於 7.4.0 及以上版本

bugsnag 效能功能最簡單的組態如下所示

{
  bugsnag: {
    apiKey: 'YOUR API KEY',
    performance: true
  }
}

對於自訂選項，您可以使用以下組態，並從這裡取得所有設定

{
  bugsnag: {
    apiKey
    config: {
      performanceConfig: {
        autoInstrumentFullPageLoads: true,
      }
    }
  }
}

自訂效能監控

如需傳送自訂 Span，請參閱此文件。模組中有一個小幫手可用於傳送自訂 span。

這只能在用戶端使用，絕不能在伺服器端呼叫。其中包含一個模擬，因此您無需擔心，但應牢記在心。

useBugsnagPerformance().startSpan('my-span')

開發

複製此儲存庫
使用 npm install 安裝依賴項
使用 npm run dev 啟動開發伺服器

授權條款

MIT 授權條款