開啟 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'
  ]
}

您可以在 config 物件中傳遞每個 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,
      }
    }
  }
}

自訂效能監控

如需傳送自訂跨度，請參閱此文件。模組中有一個小幫手可以傳送自訂跨度。

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

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

開發

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

許可證

MIT 許可證