- Notifications
You must be signed in to change notification settings - Fork8
vue-raven automatically reports uncaught JavaScript exceptions triggered from vue component
License
anteriovieira/vue-raven
Folders and files
| Name | Name | Last commit message | Last commit date | |
|---|---|---|---|---|
Repository files navigation
VueRaven automatically reports uncaught JavaScript exceptions triggered from vue component, and provides a API for reporting your own errors. The captured errors will be reported to the sentry where you can get an overview of your application. If you do not already have aSentry account, creating your account will be the first step to using this package.
npm install --save vue-raven# oryarn add vue-ravenTo get started, you need to configure VueRaven to use yourSentry DSN:
importVuefrom'vue'importVueRavenfrom'vue-raven'Vue.use(VueRaven,{dsn:'https://<key>@sentry.io/<project>'})
<!-- Include after Vue --><!-- Local files --><scriptsrc="vue-raven/dist/vue-raven.js"></script><!-- From CDN --><scriptsrc="https://unpkg.com/vue-raven"></script><script>Vue.use(VueRaven,{dsn:'https://<key>@sentry.io/<project>'})constapp=newVue({el:'#app',// ...})</script>
Only these settings allow VueRaven capture any uncaught exception.
| Option | Type | Default | Info |
|---|---|---|---|
| dsn | String | null | The Data Source Name |
| public_dsn | String | null | If value omitted it will be generated using dsn value, by removing private key part. |
| public_key | String | null | Will be ignored if dsn provided. |
| private_key | String | null | Will be ignored if dsn provided. |
| host | String | sentry.io | Will be ignored if dsn provided. |
| protocol | String | https | Will be ignored if dsn provided. |
| project_Id | String | null | Will be ignored if dsn provided. |
| path | String | null | Will be ignored if dsn provided. |
| disableReport | Boolean | false | Disable all reports. |
| disableAutoReport | Boolean | false | Disable auto report. |
| environment | String | production | Sentry's environment. |
By default vueraven will report the errors captured automatically, but you can disable using thedisableAutoReport option:
importVuefrom'vue'importVueRavenfrom'vue-raven'Vue.use(VueRaven,{dsn:'https://<key>@sentry.io/<project>'disableAutoReport:true,})
In some cases you may want to report erros manually, for this you will have thereven-js api available at the instance of the component.
// my-componentexportdefault{methods:{// ...asyncsaveUser(){try{awaitUser.save(/* data */)}catch(err){this.$raven.captureException(err)}}}}
or
import{Raven}from'vue-raven';// my-componentexportdefault{methods:{// ...asyncsaveUser(){try{awaitUser.save(/* data */)}catch(err){Raven.captureException(err)}}}}
We create a smallexample so you can see the plugin in action.
About
vue-raven automatically reports uncaught JavaScript exceptions triggered from vue component