源映射的目的是什么？

Question

有人可以解释一下源地图的意义吗？ 因为在我看来，我的串联和缩小文件与 100 多个模块一起加载（谈论 JavaScript）。 当我加载两倍于以前的大小时，这如何不影响性能？

Answer 1

源映射的重点是您可以运行缩小的 Javascript 或转译的 Javascript（它本身在调试器中不是特别可读），但是当您打开调试器时，源映射由调试器加载并为您提供可读的用于调试目的的源代码形式。 如果浏览器未配置源映射调试，则不会加载源映射。

如果您将代码从 TypeScript 或 ES6 转换为 ES5 Javascript，源映射也非常有用，这样您就可以看到您最初在调试器中编写的实际代码，而不仅仅是转换和缩小的输出。

在源地图时代之前的替代方案是在您的网站上拥有单独版本的站点或选项，这些版本将加载非缩小的 JS，以便您可以使用普通符号进行调试，但这当然实际上并不是调试完全相同的代码所以即便如此，这仍然可能让您不得不尝试调试缩小的代码。

您可以在此处阅读有关如何在 Chrome 调试器中启用源映射的信息。 如果您正在查看浏览器下载的内容，请确保您使用的浏览器在检查是否已下载时未启用源映射。

Answer 2

因为只有在打开调试器时才加载 sourcemap。

不打开调试器的实际用户仍然可以从缩小中受益。

Answer 3

源映射是一种开发人员工具。 当在缩小的源中发生错误时知道原始源是实用的，因此您可以追踪错误的源。

因此，源映射仅由调试器加载，默认情况下不会加载。 但是，您应该考虑禁用生产环境的源映射，因为调试数据通常不应该在生产环境中：出于性能和（更重要的）安全原因