Skip to content

savokiss/vue-raven

Repository files navigation

vue-raven

npm (scoped with tag) vue2 dependencies

Using sentry's raven.js in vue

Installation

$ npm i @ecg/vue-raven

Usage

Configure

Configure your dsn first: Sentry DSN

import Vue from 'vue'
import VueRaven from '@ecg/vue-raven'
import pkg from '../package.json'

Vue.use(VueRaven, {
  dsn: 'https://<key>@sentry.io/project', // or your custom public dsn
  version: pkg.version, // optional
})

Manual Report

  • In .vue file
// some-component.vue
export default {
  methods: {
    onSubmit () {
      try {
        Form.submit(/* data */)
      } catch (err) {
        this.$raven.captureException(err)
        // this.$raven.captureMessage('msg')
      }
    }
  }
}
  • In .js file
// api.js
import { Raven } from '@ecg/vue-raven'
// your service
export default {
  login (params) {
    return api.get(url, params).then(res => {
      if(res.ok) {
        const user = res.data.user
        // set user context
        // the context will be send with error report
        Raven.setUserContext({
          id: user.id
          username: user.username,
          email: user.email, // omit or must be valid email
          // you can provided extra context here 
        })
      }
      return res
    })
  }
}

Options

Option Type Default Info
dsn String '' The Data Source Name
env String 'production' The Environment Name
version String '' Provide Your App Version
disableReport Boolean false Disable All Report In Your App, You Can Use process.env.NODE_ENV === 'development' For Development
disableVueReport Boolean false Disable Auto Report In Vue
config Boolean Object Extra config for sentry

Related Projects

Lisence

MIT

About

Using sentry's raven.js in vue

Topics

Resources

License

Stars

Watchers

Forks

Packages

No packages published