解决DevTools failed to load SourceMap Could not load content for .js.map HTTP error code 404 问题

简介: 解决DevTools failed to load SourceMap Could not load content for .js.map HTTP error code 404 问题

问题

DevTools failed to load SourceMap: Could not load content for ***.js.map: HTTP error: status code 404, net::ERR_UNKNOWN_URL_SCHEME

项目开发完之后,在用Chrome浏览器调试的时候发现控制台有两条警告,如图所示:

分析

这里抛出DevTools failed to load SourceMap警告的原因是:

  • 项目引用的第三方的JavaScript工具是压缩后的版本,
  • 存在SourceMap的指向信息,
  • 浏览器启用了JavaScript源映射,
  • 但是我的项目中没有相应的SourceMap文件,所以抛出此异常。

SourceMa是从已转换的代码映射到原始源的文件,使浏览器能够重构原始源并在调试器中显示重建的原始源,调试原始源代码会比浏览器下载的转换后的代码更加容易。

其实这里没有SourceMap文件是不会影响项目的正常运行和使用的。

解决

如果不想看到类似的警告信息,可以在Chrome的控制台的设置中去设置一下,不启用JavaScript源映射即可:

第一步:在控制台右上角点击【设置】

第二步:在设置面板中Preferences -> Sources -> Enable JavaScript source maps

勾选掉 【Enable JavaScript source maps】选项.

最后刷新页面再看看控制台:没有显示警告信息了。

参考:

https://stackoverflow.com/questions/61339968/devtools-failed-to-load-sourcemap-could-not-load-content-for-chrome-extension

相关文章
|
监控 JavaScript 前端开发
深入理解 Nuxt.js 中的 app:error 钩子
【9月更文挑战第25天】在 Nuxt.js 中,`app:error` 钩子是一个强大的工具,用于处理应用程序中的各种错误。它可以在服务器端渲染或客户端运行时触发,帮助提升应用稳定性和用户体验。通过在 `nuxt.config.js` 中定义该钩子,开发者可以实现错误页面显示、错误日志记录及错误恢复等功能,确保应用在遇到问题时能妥善处理并恢复正常运行。
374 10
|
Ubuntu Linux iOS开发
问题./configure: error: the HTTP gzip module requires the zlib library.处理
问题./configure: error: the HTTP gzip module requires the zlib library.处理
2814 6
|
网络架构
CondaHTTPError HTTP 000 CONNECTION FAILED错误解决方案
以上就是解决"CondaHTTPError: HTTP 000 CONNECTION FAILED"错误的一些方法。希望这些方法能够帮助你解决问题。如果以上方法都无法解决你的问题,你可能需要寻求专业的技术支持。
2198 23
|
网络安全
网络问题解析:如何解决CondaHTTPError HTTP 000 CONNECTION FAILED错误。
以上就是斯诺普为你准备的解决Conda出现HTTP连接错误的手术室。希望这辆小车可以顺利驶出棘手的泥潭,再次在自由的大路上疾驰。一切的尝试和努力,只为更好的探索与开发。
651 17
|
缓存 JavaScript 前端开发
mapbox没有token/token失效,地图闪烁后变空白,报错Error: A valid Mapbox access token is required to use Mapbox GL JS.
本博客介绍了mapbox如何去除token验证,暴力破解mapbox的token验证机制。一劳永逸解决mapbox地图闪现一下然后变成空白,报错Error: A valid Mapbox access token is required to use Mapbox GL JS.的方法,还介绍了类似问题的具体解决思路。 只有锻炼思维才能可持续地解决问题,只有思维才是真正值得学习和分享的核心要素。如果这篇博客能给您带来一点帮助,麻烦您点个赞支持一下,还可以收藏起来以备不时之需,有疑问和错误欢迎在评论区指出~
|
数据采集 网络安全 Python
【Python】怎么解决:urllib.error.HTTPError: HTTP Error 403: Forbidden
解决 `urllib.error.HTTPError: HTTP Error 403: Forbidden`错误需要根据具体情况进行不同的尝试。通过检查URL、模拟浏览器请求、使用代理服务器和Cookies、减慢请求速度、使用随机的User-Agent以及使用更加方便的 `requests`库,可以有效解决此类问题。通过逐步分析和调试,可以找到最合适的解决方案。
2302 18
|
数据采集 数据安全/隐私保护 Python
【Python】已解决:urllib.error.HTTPError: HTTP Error 403: Forbidden
通过上述方法,可以有效解决 `urllib.error.HTTPError: HTTP Error 403: Forbidden` 错误。具体选择哪种方法取决于服务器对请求的限制。通常情况下,添加用户代理和模拟浏览器请求是最常见且有效的解决方案。
2413 10
|
开发者 UED
深入理解 Nuxt.js 中的 app:error 钩子
【9月更文挑战第26天】在 Nuxt.js 中,钩子函数是在特定生命周期阶段执行代码的机制,`app:error` 钩子用于处理应用中的错误,包括服务器端和客户端渲染时出现的问题。它提供了一个集中处理错误的机制,提升了用户体验。当组件渲染过程中出现错误时,`app:error` 钩子会被触发,可以在 `nuxt.config.js` 文件中定义该钩子。通过分析错误对象 `err` 和上下文信息 `context`,开发者可以更好地处理各种错误情况。相比组件内的 `try/catch` 或浏览器原生错误处理,`app:error` 提供了更全局和有针对性的错误处理方式。
416 6
|
JavaScript 前端开发 开发者
Chrom devtools JS调试、性能优化与必备功能
Chrom devtools JS调试、性能优化与必备功能