link管理

链接快照平台

输入网页链接，自动生成快照
标签化管理网页链接

相关文章推荐

时尚的大葱 · 在 Flutter 中集成 Google Maps· 6 天前 ·

内向的杯子 · 教程 - 从 Google Maps 迁移 ...· 6 天前 ·

酒量大的洋葱 · Google Maps（JS）开发教程汇总 ...· 6 天前 ·

刚分手的皮蛋 · 如何用python画张地图 | ...· 1 周前 ·

无聊的长颈鹿 · [SOLVED] Display ...· 2 周前 ·

奋斗的豆浆 · 感受青潍零距离！当青岛机场变成了“潍坊的机场 ...· 4 周前 ·

奔跑的鼠标垫 · configure和make ...· 1 月前 ·

善良的荔枝 · 體驗米其林中的元宇宙、絕世秘境裡的奢華露營， ...· 2 月前 ·

坚强的椅子 · 如何在Python中给折线图上的每个点标记其数值？· 6 月前 ·

酒量大的拐杖 · Android | 下载 | Slack· 1 年前 ·

);}h1 .anchor svg,h2 .anchor svg,h3 .anchor svg,h4 .anchor svg,h5 .anchor svg,h6 .anchor svg{opacity:0;-webkit-transition:opacity 0.2s ease-out;transition:opacity 0.2s ease-out;}h1:hover .anchor svg,h2:hover .anchor svg,h3:hover .anchor svg,h4:hover .anchor svg,h5:hover .anchor svg,h6:hover .anchor svg,h1 .anchor:focus svg,h2 .anchor:focus svg,h3 .anchor:focus svg,h4 .anchor:focus svg,h5 .anchor:focus svg,h6 .anchor:focus svg{opacity:1;}h1 code,h2 code,h3 code,h4 code,h5 code,h6 code{font-size:inherit;}h1 var,h2 var,h3 var,h4 var,h5 var,h6 var,h1 mark,h2 mark,h3 mark,h4 mark,h5 mark,h6 mark{font-size:inherit;}h1{line-height:1.15;font-weight:bold;margin-bottom:1rem;}h2{line-height:1.75rem;margin-bottom:0.75rem;font-weight:600;}h3{margin-bottom:0.75rem;font-weight:600;}h4,h5,h6{margin-bottom:0.5rem;font-weight:600;}ol,ul{margin:0;padding-left:1.75rem;}ol >li,ul >li{line-height:1.969rem;margin:0.344rem 0;}ul>li::marker{color:var(--system-text-secondary-light);}.dark-mode ul>li::marker{color:var(--system-text-secondary-dark);}ul ul li::marker{color:var(--color-black);}.dark-mode ul ul li::marker{color:var(--color-white);}code,var{font-family:var(--code-font);white-space:pre-wrap;}*:not(pre)>code,var,mark{padding:0.2em 0.4em;border-radius:3px;font-size:85%;word-break:break-word;}blockquote{border-left:0.25rem solid var(--secondary-text-color);color:var(--secondary-text-color);padding:0.25rem 1rem;margin:0;font-style:italic;}pre{margin:0;}hr{border:none;border-bottom:1px solid var(--divider-color);}var,mark{line-height:1.25;display:inline;}var{font-style:normal;}mark{background:var(--code-console-text-highlight);}figcaption{font-size:0.75rem;color:var(--accent-text-color);}.gatsby-resp-image-wrapper,.gatsby-resp-image-image,.gatsby-resp-image-background-image{border-radius:0.25rem;}.grecaptcha-badge{;}.osano-cm-widget{;}.screenreader-only{clip:rect(1px, 1px, 1px, 1px);-webkit-clip-path:inset(50%);clip-path:inset(50%);height:1px;width:1px;margin:-1px;overflow:hidden;padding:0;}.header-anchor{top:0;left:0;-webkit-transform:translateX(-100%);-moz-transform:translateX(-100%);-ms-transform:translateX(-100%);transform:translateX(-100%);padding-right:4px;}.children-nowrap *{white-space:nowrap;}

Upload source maps to un-minify JS errors

Our supports the uploading of source maps.

Source maps support is primarily useful for "decoding" minified JavaScript. Minified JavaScript results in mostly useless error stack traces on browser's Errors page. Uploading source maps converts these errors to understandable stack traces, with useful references to code lines. This feature might also be useful for bundled or transpiled JavaScript code.

Browser gives you two options for using source maps:

Upload source maps via the browser UI
Publish source maps to browser via the API

This document will explain the first method: how to upload source maps via the UI, along with general troubleshooting help . For instructions on using the API method, see Push source maps via the API .

Import source maps via the New Relic UI

You can drag and drop, or upload, a source map file into the browser UI to associate it with a specific JavaScript file. New Relic will then convert minified stack traces into un-minified traces and source code visible on the Errors page.

Download your source map on your local machine.
Go to one.newrelic.com > All capabilities > Browser > (select an app) > Errors , then click on an error group. (Do not select a group labeled Errors without a stack trace .)
In the Stack trace section, click the Upload source map .
In the file finder pop-up, select your source file. An error frame with a gray strip on the left side indicates minified JS. A blue strip indicates it has had a source map applied.

Other JS error frame features include:

If you want to...	Do this...
See more of the surrounding code	Select `Show 10 more lines above/below` to view the code before or after the code in the stack trace.
See original, minified file information	For individual frame info: Next to the frame's source line and column, mouse over the ellipsis. For raw data of the entire stack trace: At the top of the error tab, select < /> Raw .
Remove a source map	From an expanded stack trace frame, select Remove file .

Troubleshooting

Stack traces are still minified

If you have uploaded source maps to New Relic and still see minified stack traces, there are a few things to check. Using the API is the best way to investigate potential issues, by listing or deleting published source maps .

Typical problems	Troubleshooting tips
URL mismatch	Each frame in the stack trace is associated with a specific JavaScript URL. That URL must match the JavaScript URL that was used when publishing the source map. Ensure that these URLs match exactly.
Release name/ID mismatch	If the JavaScript URL is not versioned when you deploy your frontend assets, a release name and release ID must be specified using the `newrelic.addRelease` API method , and also when publishing your source maps. Ensure that these strings match exactly.
409 error: `Combination of javascriptUrl, releaseName, and releaseId must be unique`	If a source map file for a particular JavaScript URL is uploaded without a release name or ID specified, New Relic treats the URL as a unique identifier. To resolve this, delete the source map that has NULL release name and ID values and re-upload all versions for that URL including those parameters. This will allow multiple versions of source maps for a particular JS URL.
Missing `SourcesContent` component	Your mapping file must contain the `SourcesContent` component for New Relic to un-minify your stack traces. If you have uploaded your map successfully and are still not seeing un-minified code, check the original source map for this component. If you can't find it, regenerate the source map so the component is included, and upload your map to New Relic. If the `SourcesContent` component is not added, an error similar to `Whoops, that was the wrong file. Please try again.` will appear.

Can't generate source maps

Having trouble even generating source maps? Every build system has its own instructions for generating source maps. For more specific details, please see the documentation for your particular tool. Below are source map generation instructions for two popular build systems:

Generate source maps using UglifyJS: When "uglifying" source files, specify a source map file name and include the original source content:

Starting on version v3.12.5:

bash

$uglifyjs [source files]   \ 
>     -o bundle.min.js   \ 
>     -c -m
$     --source-map "includeSources=true"

For older versions:

bash

$uglifyjs [source files]   \ 
>     -o bundle.min.js   \ 
>     --source-map bundle.min.js.map   \ 
>     --source-map-include-sources   \ 
>     -c -m

Generate source maps using Webpack : In your production webpack config, simply specify source-map for the config.devtool property. The sourceMapFilename property of config.output is optional and defaults to [name].js.map .

devtool: 'source-map', 
output: { 
     path: path.join(__dirname, 'dist'), 
     filename: '[name].js', 
     sourceMapFilename: '[name].js.map', 
},

Upload source maps to un-minify JS errors

Import source maps via the New Relic UI

Troubleshooting

Stack traces are still minified

Can't generate source maps

Generate source maps with UglifyJS

Generate source maps with webpack