Merge branch 'build/upgradeSentry' into feat/fix

.sentryclirc.js

-module.exports = {
-  // Sentry options are required
-   organization: 'sentry',
-   project: 'group-buy-ui',
-   apiKey: '0d3fa45c10f047d7bfe03eb268a93c23a878d7585dc749418f728f88d65e1477',
+const crypto = require('crypto');
+const pkgInfo = require('./package.json');
+const project = pkgInfo.name;
+const hashName = crypto
+  .createHash('md5')
+  .update(project)
+  .digest('hex')
+  .substr(0, 8);
 
-   // Release version name/hash is required
-   release: 'group-buy-ui@1.0.0',
-   baseSentryURL: 'http://sentry.quantgroups.com/api/0',
-   deleteAfterCompile: true,
-   include: /static\/js\//, // 只上传js和map文件
-   ignore: ['node_modules'],
-   suppressErrors: true,
-   filenameTransform: function (filename) {
-    return '~/group-buy-ui/public/' + filename
-   },
- }
+module.exports = {
+  org: 'sentry',
+  project,
+  authToken: '3f1f6f3789594e3a81280c1cd8d4d1008037a7abad714698b60b6f358c3d7562',
+  url: 'http://newsentry.quantgroups.com',
+  release: `${project}@1.0.0`,
+  ignore: ['node_modules', 'tests'],
+  silent: true,
+  include: [
+    {
+      paths: ['./dist/js'],
+      urlPrefix: `https://misc.lkbang.net/${hashName}/`
+    }
+  ]
+};

package.json

@@ -17,6 +17,7 @@
     "@qg/qg-scroll": "^1.4.2",
     "@qg/ui-request": "^0.0.20",
     "@qg/ui-track-web": "0.0.3",
+    "@sentry/vue": "^7.8.1",
     "core-js": "^3.6.5",
     "crypto-js": "^3.1.9-1",
     "@commitlint/cli": "^13.2.1",
@@ -24,7 +25,6 @@
     "intersection-observer": "^0.12.0",
     "js-cookie": "^2.2.1",
     "qiniu-js": "^3.3.1",
-    "raven-js": "^3.27.2",
     "sa-sdk-javascript": "^1.15.16",
     "swiper": "^4.0.7",
     "vue": "2.6.11",
@@ -37,11 +37,11 @@
     "@babel/plugin-proposal-nullish-coalescing-operator": "^7.12.1",
     "@babel/plugin-proposal-optional-chaining": "^7.12.7",
     "@qg/webpack-cos-cdn-upload-plugin": "1.0.2",
-    "@vue/cli-plugin-babel": "^4.4.0",
-    "@vue/cli-plugin-eslint": "^4.4.0",
-    "@vue/cli-plugin-router": "^4.4.0",
-    "@vue/cli-plugin-vuex": "^4.4.0",
-    "@vue/cli-service": "^4.4.0",
+    "@vue/cli-plugin-babel": "4.4.6",
+    "@vue/cli-plugin-eslint": "4.4.6",
+    "@vue/cli-plugin-router": "4.4.6",
+    "@vue/cli-plugin-vuex": "4.4.6",
+    "@vue/cli-service": "4.4.6",
     "@vue/eslint-config-prettier": "^6.0.0",
     "babel-eslint": "^10.1.0",
     "babel-plugin-import": "^1.13.0",
@@ -56,7 +56,7 @@
     "prettier": "^1.19.1",
     "svg-sprite-loader": "^5.2.1",
     "vue-template-compiler": "2.6.11",
-    "webpack-sentry-plugin": "^2.0.3"
+    "@qg/sentry-webpack-plugin": "1.19.0"
   },
   "lint-staged": {
     "src/**/*.{js,vue}": [
@@ -70,4 +70,4 @@
       "commit-msg": "commitlint -e $HUSKY_GIT_PARAMS"
     }
   }
-}
+}
\ No newline at end of file

src/components/error/index.vue

@@ -2,6 +2,8 @@
   <div class="page error">
     <cr-image src="@/assets/images/error/error.png" width="298px" height="153px" />
     <p>oh，no…出错了</p>
+    <button @click="throwError">Throw error</button>
+
     <cr-button type="primary" block shape="circle" @click="backurl">返回</cr-button>
   </div>
 </template>
@@ -13,6 +15,9 @@ export default {
   },
   mounted() {},
   methods: {
+    throwError() {
+      throw new Error('Sentry Error');
+    },
     backurl() {
       this.$router.go(-1);
     }

src/main.js

@@ -8,18 +8,17 @@ import '@/service/cherryUI.service';
 import './style/index.less';
 import saService from '@/service/sa.service';
 import Bridge from '@qg/js-bridge';
-import Raven from 'raven-js';
-import RavenVue from 'raven-js/plugins/vue';
-import { release } from '../.sentryclirc';
+import { init as sentryInit } from '@sentry/vue';
 import lazyload from '@qg/cherry-ui/src/lazyload/index';
 import 'intersection-observer';
 if (process.env.SENTRY_ENV !== 'test' && process.env.NODE_ENV === 'production') {
-  Raven.config('//8d1b2a5f74bb42ad806e52a11b1173f2@sentry.q-gp.com/80', {
-    release,
+  sentryInit({
+    Vue,
+    dsn: 'https://d36508238b7c4e5fa8306948b52948e1@sentry.q-gp.com/11', // 项目设置中的Client Keys
+    release: 'group-buy-ui@1.0.0', // 项目名加版本号
+    tracesSampleRate: 0.5, // 上报频率, 1最大, 0最小, 建议验证设置为1, 项目运行根据情况降低频率
     environment: process.env.NODE_ENV
-  })
-    .addPlugin(RavenVue, Vue)
-    .install();
+  });
 }
 Vue.prototype.util = new Bridge();
 Vue.prototype.$track = saService;

vue.config.js

 const path = require('path');
 const resolve = dir => path.join(__dirname, dir);
 const IS_PROD = process.env.NODE_ENV === 'production';
+const webpack = require('webpack');
 const WebpackCosCdnUploadPlugin = require('@qg/webpack-cos-cdn-upload-plugin');
-const SentryPlugin = require('webpack-sentry-plugin');
+const SentryPlugin = require('@qg/sentry-webpack-plugin');
 const SentryConfig = require('./.sentryclirc');
 // cdn预加载使用
 const externals = {
@@ -25,7 +26,12 @@ const cdn = {
 };
 
 module.exports = {
-  transpileDependencies: [/[/\\]node_modules[/\\]@qg[/\\]cherry-ui[/\\]/],
+  transpileDependencies: [
+    /[/\\]node_modules[/\\]@qg[/\\]cherry-ui[/\\]/,
+    /[/\\]node_modules[/\\]@qg[/\\]js-bridge[/\\]/,
+    /[/\\]node_modules[/\\]@qg[/\\]ui-track-web[/\\]/,
+    /[/\\]node_modules[/\\]@qg[/\\]@sentry[/\\]/
+  ],
   chainWebpack: config => {
     config.plugin('html').tap(args => {
       args[0].title = '';
@@ -88,6 +94,11 @@ module.exports = {
           priority: 10,
           chunks: 'initial' // only package third parties that are initially dependent
         },
+        sentry: {
+          name: 'chunk-sentry', // sentry
+          priority: 20, // the weigh1t needs to be larger than libs and app or it will be packaged into libs or app
+          test: /[\\/]node_modules[\\/]@sentry[\\/]/ // in order to adapt to cnpm
+        },
         libs: {
           name: 'chunk-libs', // 分离非在入口加载的，但是引用超过2次的依赖
           test: /[\\/]node_modules[\\/]/,
@@ -127,8 +138,13 @@ module.exports = {
     if (IS_PROD) {
       config.externals = externals;
       configObj = {
-        plugins: [new SentryPlugin(SentryConfig), new WebpackCosCdnUploadPlugin()]
-        // plugins: [new WebpackCosCdnUploadPlugin()]
+        plugins: [
+          new SentryPlugin(SentryConfig),
+          new webpack.DefinePlugin({
+            'process.env.SENTRY_ENV': `"${process.env.SENTRY_ENV || ''}"`
+          }),
+          new WebpackCosCdnUploadPlugin()
+        ]
       };
     }
     return configObj;