Vue & Sentry sourcemaps All In One

vue & sentry & sourcemaps

https://docs.sentry.io/platforms/javascript/guides/vue/sourcemaps/

https://docs.sentry.io/platforms/javascript/guides/vue/sourcemaps/uploading/



question

401 bug

https://github.com/getsentry/sentry-webpack-plugin/issues/250

https://github.com/getsentry/sentry-webpack-plugin/issues/236#issuecomment-757605146

solutions

After I change authToken to auto it works!

before

    new SentryWebpackPlugin({
// sentry-cli configuration
// authToken , but in sentry.io
// token: process.env.SENTRY_AUTH_TOKEN,,
authToken: process.env.SENTRY_AUTH_TOKEN,
// 组织名称 unique id
org: "sentry",
// 项目名称 unique id
project: "vue-web-app",
include: ".",
ignore: ["node_modules", "webpack.config.js"],
}),

afrter

    new SentryWebpackPlugin({
// sentry-cli configuration
// token
token: process.env.SENTRY_AUTH_TOKEN,,
// authToken: process.env.SENTRY_AUTH_TOKEN,
// 组织名称 unique id
org: "sentry",
// 项目名称 unique id
project: "vue-web-app",
include: ".",
ignore: ["node_modules", "webpack.config.js"],
}),

sentry-cli

https://docs.sentry.io/learn/cli/configuration/

auth-token ? token

https://sentry.io/settings/account/api/auth-tokens/

https://github.com/getsentry/sentry-webpack-plugin/issues/60#issuecomment-391331924

auth-tokens & internal integrations

Auth Tokens are tied to the logged in user, meaning they'll stop working if the user leaves the organization! We suggest using internal integrations to create/manage tokens tied to the organization instead.

身份验证令牌与已登录的用户相关联,这意味着如果用户离开组织,它们将停止工作!我们建议改为使用内部集成来创建/管理与组织绑定的令牌。

auth-tokens

https://sentry.io/settings/account/api/auth-tokens/

internal integrations

https://sentry.io/settings/webgeeker/developer-settings/new-internal/

https://docs.sentry.io/api/

问题排查

  1. sourceMappingURL
//# sourceMappingURL=script.min.js.map

https://blog.sentry.io/2018/10/18/4-reasons-why-your-source-maps-are-broken

Vue 项目接入 Sentry 引导

https://sentry.xgqfrms.xy

https://sentry.xgqfrms.xyz/sentry/vue-web-app/getting-started/javascript-vue/

https://sentry.io

https://sentry.io/webgeeker/vue-web-app/getting-started/javascript-vue/

settings

https://sentry.io/settings/webgeeker/projects/vue-web-app/

source-maps

https://sentry.io/settings/webgeeker/projects/vue-web-app/source-maps/

webpack & source-maps

https://docs.sentry.io/platforms/javascript/sourcemaps/tools/webpack/

const SentryWebpackPlugin = require("@sentry/webpack-plugin");

module.exports = {
// other configuration
configureWebpack: {
plugins: [
new SentryWebpackPlugin({
// sentry-cli configuration
authToken: process.env.SENTRY_AUTH_TOKEN,
org: "fullstack-web",
project: "react-app", // webpack specific configuration
include: ".",
ignore: ["node_modules", "webpack.config.js"],
}),
],
},
};

refs

401

https://developer.mozilla.org/en-US/docs/Web/HTTP/Status/401



xgqfrms 2012-2020

www.cnblogs.com 发布文章使用:只允许注册用户才可以访问!


Vue & Sentry sourcemaps All In One的更多相关文章

  1. Vue & Sentry & ErrorHandler

    Vue & Sentry & ErrorHandler import * as Sentry from '@sentry/browser'; import { Vue as VueIn ...

  2. Vue & Sentry

    Vue & Sentry config.errorHandler https://cn.vuejs.org/v2/api/#errorHandler Vue.config.errorHandl ...

  3. vue+sentry 前端异常日志监控

    敲代码最糟心不过遇到自己和测试的环境都OK, 客户使用有各种各样还复现不了的问题,被逼无奈只能走到这一步:前端异常日志监控! vue官方文档如下推荐: 就是说, vue有错误机制处理errorHand ...

  4. Sentry 高级使用教程

    Sentry 高级使用教程 Sentry versions https://github.com/getsentry/sentry-docs https://github.com/getsentry/ ...

  5. requirejs + vue 项目搭建2

    上篇是年后的项目搭建的,时间比较仓促,感觉有点low 1.gulp-vue 文件对公用js的有依赖,以后别的同事拿去搭其他项目,估计会被喷 2.不支持vue-loader一样写模版语言和es6语法 最 ...

  6. [转] vue前端异常监控sentry实践

    1. 监控原理 1.1 onerror 传统的前端监控原理分为异常捕获和异常上报.一般使用onerror捕获前端错误: window.onerror = (msg, url, line, col, e ...

  7. Sentry项目监控工具结合vue的安装与使用(前端)

    一.官网:https://sentry.io/welcome/ 二.介绍 Sentry 是一个开源的实时错误报告工具,支持 web 前后端.移动应用以及游戏,支持 Python.OC.Java.Go. ...

  8. Sentry React SourceMaps All In One

    Sentry React SourceMaps All In One React https://docs.sentry.io/platforms/javascript/guides/react/ h ...

  9. 前端异常日志监控 - 使用Sentry

    背景 现在的前端项目越来越复杂,在不同的客户端会产生各种在开发人员机器上不会出现的问题.当用户报告一个问题给开发人员的时候,开发人员无法直接定位问题.在此前,听过一次鹅厂的前端人员,他们对QQ里面的网 ...

随机推荐

  1. canvas性能-drawImage渲染图片

    canvas性能-绘制图片 目录 canvas性能-绘制图片 canvas绘制图片 drawImage putImageData createPattern 测试绘制耗时 drawImage Imag ...

  2. 三. SpringCloud服务注册与发现

    1. Eureka 1.1 Eureka理解 什么是服务治理 Spring Cloud封装了Netflix公司开发的Eurkeka模块来实现服务治理 在传统的rpc远程调用框架中,管理每个服务与服务之 ...

  3. connection-backoff ConnectionBackoff Strategy 回退

    grpc/connection-backoff.md at master · grpc/grpc https://github.com/grpc/grpc/blob/master/doc/connec ...

  4. HTTP/1HTTP/2HTTP/3

    https://mp.weixin.qq.com/s/fy84edOix5tGgcvdFkJi2w

  5. http2 http1 对比

    RFC 7540 - Hypertext Transfer Protocol Version 2 (HTTP/2) https://tools.ietf.org/html/rfc7540#page-4 ...

  6. Git恢复之前版本的两种方法reset、revert

    实战 回退 1.删除之前的提交 git reset --hard id 推送到远程 git push -f [git log中确实删除了,但是拿到可以恢复] 2.不删除之前的提交 git revert ...

  7. Promise 中reject 和 catch 处理上有什么区别

    reject 是用来抛出异常,catch 是用来处理异常reject 是 Promise 的方法,而 catch 是 Promise 实例的方法reject后的东西,一定会进入then中的第二个回调, ...

  8. List对象集合根据组合属性进行差集运算

    背景   当List是一个基本数据类型的集合的时候,进行集合运算还比较方便,但是有这么一些业务场景,比如某个用户权限变化的列表,或者取数据的变化结果,当时有时候用笨方法多循环两次也是可以的,只不过代码 ...

  9. MySql(一)表类型(存储引擎)

    MySql(一)表类型(存储引擎) 一.MYSQL存储引擎概述 二.存储引擎的特性对比 2.1 MyISAM 2.2 InnoDB 2.2.1 自动增长列 2.2.2 外键约束 2.2.3 存储方式 ...

  10. GJ项目技术代码相关总结

    第一次实习公司的GJ项目快要结束,自己总结了一些工作中的代码,留到记录学习. 根据下拉条件,进行查询,展示出不同的表单选项:并在鼠标进入到指定区域时显示部分内容,鼠标移出内容区域时,隐藏内容. 焦点移 ...