創(chuàng)建sentry project
圖片.png
創(chuàng)建后在代碼中引入sentry的方式有cdn和npm，建議使用cdn，npm有安全令牌不存在及跨域問題，通過代理可解決跨域問題，但安全令牌問題不知道怎么解決，直接使用cdn引入則沒有任何問題
sourcemap自動上傳
- 安裝vite-plugin-sentry
npm i vite-plugin-sentry -D
-在vite.config.js中引入
import { defineConfig, loadEnv } from 'vite'
import viteSentry from 'vite-plugin-sentry'
const srcPath = path.resolve(__dirname, "src");
// https://vitejs.dev/config/
export default defineConfig(({ command, mode }) => ({
plugins: [
viteSentry({
url: 'http://ip:9000',
authToken: '...', //sentry授權(quán)令牌
org: 'sentry',
project: loadEnv(mode, process.cwd()).VITE_SENTRY_PROJECT,
release: loadEnv(mode, process.cwd()).VITE_SENTRY_VERSION,
deploy: {
env: 'production'
},
setCommits: {
auto: true
},
sourceMaps: {
include: ['./dist/assets'],
ignore: ['node_modules'],
urlPrefix: '~/assets'
}
}),
vue(),
],
...
build: {
sourcemap: true
}
-在.env.production中添加sentry配置
VITE_SENTRY_DSN:'', //項(xiàng)目dsn，從sentry后臺獲取
VITE_SENTRY_PROJECT:'Vue', //同上圖創(chuàng)建sentry project所填
VITE_SENTRY_VERSION:'product@0.0.1', //自定義的release版本，上傳sourcemap后可在sentry中項(xiàng)目的版本中看到
- 在main.js中添加init代碼
if (!import.meta.env.DEV) {
Sentry.init({
app,
dsn: import.meta.env.VITE_SENTRY_DSN,
release: import.meta.env.VITE_SENTRY_VERSION,
environment: 'production',
integrations: [new Sentry.Integrations.Vue({ app, attachProps: true })],
tracesSampler: samplingContext => {
return 1; //按需設(shè)置0至1
}
})
}
