nuxt-logrocket

LogRocket module for Nuxt.js

📖 Release Notes

Features

• Supports logrocket-vuex plugin integration by default
• Ability to run in development mode

Setup

• Add nuxt-logrocket dependency using yarn or npm to your project

yarn add nuxt-logrocket

OR

npm install nuxt-logrocket --save

• Add nuxt-logrocket to the modules section of your nuxt.config.js file

{
  modules: [
    'nuxt-logrocket',
  ],

  logRocket: {
    // configure LogRocket
    logRocketId: '',
    devModeAllowed: false,
    config: {
      //
    }
  }
}

For Typescript Users

Add the types to your "types" array in tsconfig.json after the @nuxt/types entry.

tsconfig.json

{
  "compilerOptions": {
    "types": [
      "@nuxt/types",
      "nuxt-logrocket"
    ]
  }
}

Integration with Official Sentry Module

If you're using the @nuxtjs/sentry module, this module will automatically add a LogRocket session recording URL to every Sentry exception report.

Note that in order to have this work correctly, you must add @nuxtjs/sentry with a higher priority in your nuxt.config.js file. For example:

{
  modules: [
    ...
    '@nuxtjs/sentry',
    ...
    'nuxt-logrocket'
    ...
  ]
}

You can read more about this integration here.

Options

Options can be passed using either environment variables or logRocket section in nuxt.config.js. Setting a value for the required logRocketId option is enough in most cases.

Below is the complete list of options:

This is an example containing the default values for the options:

{
  logRocketId: '',
  devModeAllowed: false,
  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
  }
}

Usage

LogRocket gets automatically injected into your application when it is setup correctly. By default this module works only in production and on client-side events.

In order to use LogRocket's injected functionality in your application, you can use :

this.$logRocket

in your components or :

app.$logRocket

in plugins.

If Vuex store is initialized, LogRocket Vuex plugin will be automatically registered.

Visit LogRocket's website for a full list of features : Docs

Development

• Clone this repository
• Install dependencies using yarn install or npm install
• Start development server using yarn run dev or npm run dev
• Point your browser to http://localhost:3000

License

MIT License - Alibaba Travels Co