在Chrome DevTools中禁用源地图

100

有没有一种快速的方法可以将Chrome DevTools中显示的jsx代码切换到原始ES5，然后再返回呢？

— 杰克·艾伦
source

Answers:

152

打开开发人员工具，转到开发人员工具的“设置”，然后Enable JavaScript Sourcemaps在“源”设置下取消选中。

— 加尔比
source

谢谢，我看到了。不幸的是，更改此选项需要刷新才能生效。我希望有某种方法可以在不刷新的情况下切换选项。

— 杰克·艾伦

不。因为需要根据设置重新解释源。

— Garbee

谢谢，我很好奇为什么这样做是必要的，因为可以肯定它总是在后台运行es5，并且源映射只是通知调试器当前语句在源代码中位于哪一行？

— 杰克·艾伦

对于那些努力寻找像我这样的设置的人，请参见：i.imgur.com/9aMlBfg.png

— joshcomley

我只是尝试了一下，它似乎确实具有立竿见影的效果，即似乎不再需要刷新页面。

— 杰克逊

您可以双击行号从源文件跳转到未缩小的输出文件。除此之外，它似乎是有限的。请参阅下面的评论。

我发现这在开发过程中很有用。在webpack-dev-server不缩小js的情况下使用（或其他工具）时，可以双击源文件中的行号以跳至已编译但未缩小的输出文件。

我只是偶然发现了这个，然后在2016年12月21日找到了以下评论：https : //bugs.chromium.org/p/chromium/issues/detail?id=532174#c7

您可以双击行号以跳入原始文件，但是如果缩小的文件中删除了所有换行符，这将毫无用处:(

进行自动换行会使这项工作更好 https://bugs.chromium.org/p/chromium/issues/detail?id=167287

我认为有人支持双击缩小文件的一部分以跳入源映射文件，但它似乎已经退步了。

理想情况下，在带有源映射的缩小文件中，在缩小文件中的任何位置单击鼠标右键（或双击）都应允许跳转到该确切的文件，行和列

— 斯科蒂·瓦格纳
source

当我双击行号时，它会添加然后删除断点。我想念什么吗？

— emclain

Idk。它似乎只是在某些时候这样做。并且仅当Chrome似乎喜欢源地图时。您可以尝试一些不同的项目或项目，但实际上我没有更好的建议。Chrome应该对此提供更好的支持。

— Scotty Wagoner