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. node集群(cluster)

    使用例子 为了让node应用能够在多核服务器中提高性能,node提供cluster API,用于创建多个工作进程,然后由这些工作进程并行处理请求. // master.js const cluster ...

  2. 死锁案例 GAP 锁 没有就插入,存在就更新

    https://mp.weixin.qq.com/s/2obpN57D8hyorCMnIu_YAg 死锁案例八 文 | 杨一 on 运维 转 | 来源:公众号yangyidba 一.前言 死锁其实是一 ...

  3. 键相同,比较两个map中的值是否相同

    获取.排序.比较两个Map中相同key对应value值 /** * * @param hashMap 原数据 * @param hashMap2 需要比较的数据 * @return */ privat ...

  4. Asp.netCore 3.1控制器属性注入and异步事务Aop by AutoFac

    Aspect Oriented Programming(AOP)是较为热门的一个话题.AOP,国内我们都习惯称之为:面向切面编程 下面直接code 干货展示:(一般人我还不告诉,嘻嘻) 1:导入相关的 ...

  5. LOJ10068 秘密的牛奶运输

    LOJ10068秘密的牛奶运输 题目描述 Farmer John 要把他的牛奶运输到各个销售点.运输过程中,可以先把牛奶运输到一些销售点,再由这些销售点分别运输到其他销售点. 运输的总距离越小,运输的 ...

  6. Linux 文件搜索神器 find 实战详解,建议收藏!

    大家好,我是肖邦,这是我的第 10 篇原创文章. 在 Linux 系统使用中,作为一个管理员,我希望能查找系统中所有的大小超过 200M 文件,查看近 7 天系统中哪些文件被修改过,找出所有子目录中的 ...

  7. (九)整合 ElasticSearch框架,实现高性能搜索引擎

    整合 ElasticSearch框架,实现高性能搜索引擎 1.SpringBoot整合ElasticSearch 1.1 核心依赖 1.2 配置文件 1.3 实体类配置 1.4 数据交互层 1.5 演 ...

  8. java架构《并发线程基础一》

    1.实现线程常见的两种的方式 : 1:继承extends Thread 2:实现new Runnable 实现其run方法 2.线程安全    结论: 当多个线程访问某一个类(对象或方法)时,这个对象 ...

  9. 学习笔记 Hadoop的job提交过程,shuffle过程以及HA机制的实现

    一,在hadoop中的mapreduce的job提交过程比较繁琐,但掌握job的提交过程是我们进入深入学习的必要. 二,mapreduce的shuffle机制 三,Hadoop的HA机制.

  10. Nginx图文详解

    想必大家一定听说过 Nginx,若没听说过它,那么一定听过它的"同行"Apache 吧! Nginx 的产生 Nginx 同 Apache 一样都是一种 Web 服务器.基于 RE ...