nuxt-logrocket

バグを修正し、ユーザー行動を理解するのに役立つ Nuxt 用の LogRocket モジュール。

2.2K ダウンロード•144 スター•v2.0.14

farzadso

nuxt-logrocket

Nuxt.js 用 LogRocket モジュール

📖 リリースノート

機能

Nuxt 3 & Nuxt Bridge
Pinia 統合をサポート
開発モードでの実行機能

セットアップ

プロジェクトに yarn または npm を使用して nuxt-logrocket 依存関係を追加します

yarn add nuxt-logrocket

または

npm install nuxt-logrocket --save

nuxt-logrocket を nuxt.config.ts ファイルの modules セクションに追加します

import { defineNuxtConfig } from 'nuxt'

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

  logRocket: {
    id: '',
    dev: false,
    config: {
      //
    }
  }
})

オプション

オプションは、ランタイムコンフィグまたは nuxt.config.ts の logRocket セクションのいずれかを使用して渡すことができます。ほとんどの場合、必須の id オプションの値を設定するだけで十分です。

以下はオプションの完全なリストです

オプション	タイプ	デフォルト	必須
ID	`文字列`	`''`	True
dev	`ブーリアン`	`true`	False
enablePinia	`ブーリアン`	`true`	False
release	`文字列`	`null`	False
consoleEnabled	`ブーリアン`	`true`	False
networkEnabled	`ブーリアン`	`true`	False
networkRequestSanitizer	`関数`	-	False
networkResponseSanitizer	`関数`	-	False
domEnabled	`ブーリアン`	`true`	False
inputSanitizer	`ブーリアン`	`false`	False
textSanitizer	`ブーリアン`	`false`	False
baseHref	`文字列`	`null`	False
shouldCaptureIP	`ブーリアン`	`true`	False
rootHostname	`文字列`	`null`	False
shouldDebugLog	`ブーリアン`	`true`	False
mergeIframes	`ブーリアン`	`false`	False

これはオプションのデフォルト値を含む例です

{
  id: '',
  dev: true,
  enablePinia: true,
  config: {
    release: null,
    console: {
      isEnabled: true
    },
    network: {
      isEnabled: true,
      networkRequestSanitizer: () => {},
      networkResponseSanitizer: () => {}
    },
    dom: {
      isEnabled: true,
      inputSanitizer: false,
      textSanitizer: false,
      baseHref: null
    },
    shouldCaptureIP: true,
    rootHostname: null,
    shouldDebugLog: true,
    mergeIframes: false
  }
}

使用方法

LogRocket は正しく設定されると、アプリケーションに自動的に注入されます。デフォルトでは、このモジュールは production 環境でのみ、クライアント側のイベントで機能します。

アプリケーションで LogRocket の注入された機能を使用するには、

const { $logRocket } = useNuxtApp()

LogRocket の機能の完全なリストについては、ウェブサイトをご覧ください: ドキュメント

Pinia

このモジュールは、Pinia ストアのミューテーションを自動的に検出し、LogRocket セッションにアタッチします。

この機能はデフォルトで有効になっており、enablePinia オプションを false に設定することで無効にできます。

import { defineNuxtConfig } from 'nuxt'

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

  logRocket: {
    id: '',
    enablePinia: false
  }
})

開発

このリポジトリをクローンする
yarn install を使用して依存関係をインストールします
yarn run dev を使用して開発サーバーを起動します
ブラウザで https://:3000 にアクセスします

ライセンス

MIT ライセンス - Alibaba Travels Co