nuxt-rollbar

用於整合 Rollbar 的 Nuxt 3 模組。

Nuxt Rollbar module

Nuxt Rollbar

用於整合 Rollbar 的 Nuxt 3 模組。

設定

# pnpm
pnpm add -D nuxt-rollbar

# npm
npm i -D nuxt-rollbar

# yarn
yarn add -D nuxt-rollbar

基本用法

將 nuxt-rollbar 新增到 Nuxt 配置的 modules 部分，並提供您的 Rollbar 伺服器和/或客戶端訪問令牌。

// `nuxt.config.ts`
export default defineNuxtConfig({
  modules: ['nuxt-rollbar'],

  rollbar: {
    serverAccessToken: 'SERVER_ACCESS_TOKEN',
    clientAccessToken: 'CLIENT_ACCESS_TOKEN',
  },
});

完成！Rollbar 現在將在您的應用程式中執行。

配置

僅限客戶端

ℹ️ useRollbar 可組合項在伺服器端將返回 undefined。

export default defineNuxtConfig({
  modules: ['nuxt-rollbar'],

  rollbar: {
    clientAccessToken: 'CLIENT_ACCESS_TOKEN',
    mode: 'client',
    config: {
      // Rollbar configuration
    },
  },
});

僅限伺服器

ℹ️ useRollbar 可組合項在客戶端將返回 undefined。

export default defineNuxtConfig({
  modules: ['nuxt-rollbar'],

  rollbar: {
    serverAccessToken: 'SERVER_ACCESS_TOKEN',
    mode: 'server',
    config: {
      // Rollbar configuration
    },
  },
});

伺服器和客戶端都可用

export default defineNuxtConfig({
  modules: ['nuxt-rollbar'],

  rollbar: {
    serverAccessToken: 'SERVER_ACCESS_TOKEN',
    clientAccessToken: 'CLIENT_ACCESS_TOKEN',
    config: {
      // Rollbar configuration
    },
  },
});

模組選項

選項	型別	預設	描述
`clientAccessToken`	`string`	`''`	Rollbar 客戶端訪問令牌。
`serverAccessToken`	`string`	`''`	Rollbar 伺服器訪問令牌。
`模式`	`string`	`'all'`	您的 Rollbar 例項執行的環境模式。
`config`	`Rollbar.Configuration`	`null`	Rollbar 配置。

可組合項

與 Nuxt 3 生態系統中的其他可組合項一樣，它們是自動匯入的，可以在應用程式的元件中使用。

ℹ️ 由於 Rollbar 例項在客戶端和伺服器環境中都可用，您可以在任一上下文中使用它。

`useRollbar`

如果 Rollbar 例項可用並已為環境（客戶端或伺服器）配置，則返回該例項。否則，返回 undefined。

型別宣告

function useRollbar(): Rollbar;

示例

const rollbar = useRollbar();

rollbar.log('Hello, world!');

這個可組合項只是一個簡單的別名

useNuxtApp().$rollbar;

💻 開發

克隆此倉庫
使用 corepack enable 啟用 Corepack
使用 pnpm install 安裝依賴
執行 pnpm run dev:prepare
使用 pnpm run dev 啟動開發伺服器

鳴謝

特別感謝

nuxt-plausible
nuxt-rollbar-module

感謝提供的靈感和基礎工作。