@ecg/vue-raven

vue && raven.js intergration

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
@ecg/vue-raven
2.2.06 years ago6 years agoMinified + gzip package size for @ecg/vue-raven in KB

Readme

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 |

Related Projects

Lisence

MIT