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`	假
启用 Pinia	`布尔值`	`true`	假
发布	`字符串`	`null`	假
控制台已启用	`布尔值`	`true`	假
网络已启用	`布尔值`	`true`	假
网络请求清理器	`函数`	-	假
网络响应清理器	`函数`	-	假
DOM 已启用	`布尔值`	`true`	假
输入清理器	`布尔值`	`false`	假
文本清理器	`布尔值`	`false`	假
基本路径	`字符串`	`null`	假
是否捕获 IP	`布尔值`	`true`	假
根主机名	`字符串`	`null`	假
是否开启调试日志	`布尔值`	`true`	假
合并 Iframes	`布尔值`	`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 会自动注入到您的应用程序中。默认情况下，此模块仅在 生产 环境和客户端事件中运行。

要在应用程序中使用 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