Vue项目集成Sentry

示例代码

vue.config.js

module.exports = {
  pluginOptions: {
    'vue-cli-plugin-sentry': {
      registry: undefined,
      organization: 'webclown',
      project: 'project-1',
      apiKey: '40325cbe44584080bad902ef873c10342d737944e43a4c67bfff7836aa52b779',
      'release-mode': 'auto',
      baseSentryURL: 'https://sentry.webclown.net/api/0/',
      dsn: 'https://a54b1d1791344654a44cc8cc46197e51@sentry.webclown.net/1',
      release: '53a152b'
    }
  }
}

src/sentry.js

import Vue from 'vue';
import Raven from 'raven-js';
import RavenVue from 'raven-js/plugins/vue';

if ('production' === process.env.NODE_ENV || 'test' === process.env.NODE_ENV) {
    const ravenOptions = {
        release: process.env.__GIT_SHA__,
        environment: process.env.NODE_ENV
    };

    const dsn = 'https://a54b1d1791344654a44cc8cc46197e51@sentry.kaikeba.com/1';
    Raven.config(dsn, ravenOptions)
        .addPlugin(RavenVue, Vue)
        .install();

}

src/main.js

import Vue from 'vue'
import App from './App.vue'
import router from './router'
import './sentry.js'

Vue.config.productionTip = false

new Vue({
  router,
  render: h => h(App)
}).$mount('#app')

---

部分配置说明

1. vue-cli 3.x 完成项目初始化，

2. 安装 vue-cli-plugin-sentry 配置Sentry，

终端执行

cd [项目路径]
vue add vue-cli-plugin-sentry

需要配置：

• organization: 组织
• project: 项目名称
• apiKey: apiKey [私服]/settings/account/api/auth-tokens/ 自己项目地址生成
• baseSentryURL: [私服]/api/0
• dsn: 项目dsn

—-

---

项目环境

"vue": "^2.6.10",
"@vue/cli-service": "^3.11.0",
"raven-js": "^3.27.0",
"vue-cli-plugin-sentry": "^1.1.1",
"webpack-sentry-plugin": "^1.16.0",