官方 Sentry Nuxt SDK (Beta 版)

此 SDK 處於 Beta 版。API 是穩定的，但更新可能包含行為上的細微變化。如果您有任何回饋或疑慮，請在 GitHub 上聯繫我們。此 SDK 適用於 Nuxt。如果您正在使用 Vue，請參閱我們的 Vue SDK。

Nuxt 最低支援版本為 3.0.0。

一般

此套件是 @sentry/node（用於伺服器端）和 @sentry/vue（用於客戶端）的封裝，並新增了與 Nuxt 相關的功能。

限制

伺服器監控在開發模式 (nuxt dev) 中不可用。

手動設定

1. 先決條件 & 安裝

安裝 Sentry Nuxt SDK

# Using npm
npm install @sentry/nuxt

# Using yarn
yarn add @sentry/nuxt

2. Nuxt 模組設定

Sentry Nuxt SDK 基於 Nuxt 模組。

將 @sentry/nuxt/module 新增至 nuxt.config.ts 的模組區段。

// nuxt.config.ts
export default defineNuxtConfig({
  modules: ['@sentry/nuxt/module'],
});

3. 客戶端設定

在專案根目錄新增一個 sentry.client.config.ts 檔案。

import { useRuntimeConfig } from '#imports';
import * as Sentry from '@sentry/nuxt';

Sentry.init({
  // If set up, you can use your runtime config here
  dsn: useRuntimeConfig().public.sentry.dsn,
});

4. 伺服器端設定

在專案根目錄新增一個 sentry.server.config.ts 檔案。

import * as Sentry from '@sentry/nuxt';

// Only run `init` when process.env.SENTRY_DSN is available.
if (process.env.SENTRY_DSN) {
  Sentry.init({
    dsn: 'your-dsn',
  });
}

由於技術原因（檔案必須在 Nuxt 加載之前加載），useRuntimeConfig 在 Sentry 伺服器設定檔案中不起作用。為了能夠使用 process.env，您必須將 --env-file=.env 新增到您的 node 指令

node --env-file=.env .output/server/index.mjs

或使用 dotenv 套件。

import dotenv from 'dotenv';
import * as Sentry from '@sentry/nuxt';

dotenv.config();

Sentry.init({
  dsn: process.env.SENTRY_DSN,
});

上傳 Source Maps

要上傳 source maps，您必須在 nuxt.config.ts 中啟用客戶端 source maps。然後，您將專案設定新增至 nuxt.config.ts 的 sentry.sourceMapsUploadOptions。

// nuxt.config.ts
export default defineNuxtConfig({
  sourcemap: { client: true },

  modules: ['@sentry/nuxt/module'],
  sentry: {
    sourceMapsUploadOptions: {
      org: 'your-org-slug',
      project: 'your-project-slug',
      authToken: process.env.SENTRY_AUTH_TOKEN,
    },
  },
});

新增 sentry.server.config.ts 時，您可能會收到類似這樣的錯誤：「Failed to register ESM hook import-in-the-middle/hook.mjs」。您可以為 @vercel/nft 新增一個覆寫 (npm/pnpm) 或一個解析 (yarn) 來修正此問題。這會將 hook.mjs 檔案新增到您的建置輸出中（此處為 Nitro 問題）。

對於 npm

"overrides": {
  "@vercel/nft": "^0.27.4"
}

對於 yarn

"resolutions": {
  "@vercel/nft": "^0.27.4"
}

或對於 pnpm

"pnpm": {
  "overrides": {
    "@vercel/nft": "^0.27.4"
  }
}

@sentry/nuxt