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

最新推荐文章于 2025-03-06 17:30:00 发布

LYFlied

最新推荐文章于 2025-03-06 17:30:00 发布

阅读量5.8w

点赞数 38

分类专栏：问题&&解决文章标签：前端 chrome 调试器 javascript react

本文链接：https://blog.csdn.net/qq_39903567/article/details/114582561

版权

在使用Chrome浏览器调试前端项目时遇到DevTools无法加载SourceMap的404错误警告。这个问题通常是由于浏览器尝试加载不存在的SourceMap文件导致的。SourceMap用于帮助开发者在压缩后的代码中调试原始源码。尽管不影响项目运行，但可以关闭JavaScript源映射来消除警告。关闭方式：进入Chrome控制台设置，取消勾选「Enable JavaScript source maps」选项。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

问题

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源映射即可：

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

最低0.47元/天解锁文章