什么是LESS源图？

Question

我在这里参考LESS教程：     http://lesscss.org/usage/index.html#programmatic-usage

有人可以向我解释一下源图是什么吗？有什么用？我们何时以及如何使用源地图？

Answer 1

当您使用像LESS这样的预处理器时，结果CSS文件可能包含由于原始LESS文件中的错误而导致的错误。当在Web浏览器上检测到此类错误时，浏览器可以指向CSS文件中的行号，但这对于调试LESS文件没有用。源映射是一种机制/文件，用于保存原始LESS文件的位置信息，以便在CSS文件中检测到错误时，浏览器可以指向LESS文件中的位置。

Answer 2

由于LESS已编译，因此源映射允许您将已编译的CSS跟踪回原始源（可能包含多个部分）。这对于编译CSS中的调试问题至关重要。

源图是JSON格式，包含对编译为CSS时使用的原始文件的引用。这些可能包括用LESS，SASS，CoffeeScript等编写的文件。

这里有一个很好的概述：

http://webdesign.tutsplus.com/tutorials/how-to-use-source-maps-for-better-preprocessor-debugging--cms-22735

这也是一个很好的阅读：

http://pburtchaell.com/2014/using-source-maps/