Google Chrome 到底是怎么知道 what/where 我的来源以及如何解释它们的？
How the hell does Google Chrome know what/where my sources are and how to interpret them?
我目前正在尝试使用 Haxe 创建一个简单的小型 Web 框架。除了前端框架 (Yahoo Pure) 之外的所有内容都是使用 Haxe/HTML/CSS 的组合从头开始编写的。我正在使用 USBWebServer, and a couple of custom build/deploy scripts to copy the output JS to the UsbWebserver host directory, and to launch Google Chrome and point it at http://localhost/myserver/whatever.
在 FlashDevelop 中编写它
出于所有意图和目的，我的开发环境是一堆不同目录中混乱的脚本和文件。服务器上的输出目录中的 Haxe 代码绝对为零，只有 Haxe 编译器生成的 javascript 和 PHP 文件。
然而不知何故，通过某种黑魔法，Google Chrome 开发人员工具（使用 F12 打开）有一个 "Sources" 选项卡，其中
正确指向写入目录中我的Haxe源文件
用简单的语法高亮显示源代码
允许我在 haxe 代码中添加断点
AND 让我在到达断点时用鼠标突出显示变量（包含的对象）的值（就像您在 Visual Studio 或其他花哨的 IDE 中看到的那样）
那么 Google Chrome 到底是怎么做到的呢？我的 "launch script" 是这样的：
"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" "http://localhost:8080/mysite"
可能 解释了它是如何找到我的源目录的，因为该脚本是 运行 从那里找到的。这并没有解释 Google Chrome 如何理解 Haxe，或者知道如何逐行匹配生成的 javascript 代码与源 Haxe 代码。
我没有安装任何 Haxe 插件。我拥有的唯一与开发相关的插件是 Advanced REST 客户端和 Javascript Errors Notifier（它只是在出现 javascript 错误时添加一点视觉指示器）
这一切看起来像是（非常有用的）黑魔法。
我从未使用过 Haxe，但我认为它只是吐出常规的源映射（将源映射 variables/lines 编译），所有主流浏览器都可以解释这些映射。要了解更多信息，我推荐这篇文章：html5rocks.com/en/tutorials/developertools/sourcemaps
我目前正在尝试使用 Haxe 创建一个简单的小型 Web 框架。除了前端框架 (Yahoo Pure) 之外的所有内容都是使用 Haxe/HTML/CSS 的组合从头开始编写的。我正在使用 USBWebServer, and a couple of custom build/deploy scripts to copy the output JS to the UsbWebserver host directory, and to launch Google Chrome and point it at http://localhost/myserver/whatever.
在 FlashDevelop 中编写它出于所有意图和目的，我的开发环境是一堆不同目录中混乱的脚本和文件。服务器上的输出目录中的 Haxe 代码绝对为零，只有 Haxe 编译器生成的 javascript 和 PHP 文件。
然而不知何故，通过某种黑魔法，Google Chrome 开发人员工具（使用 F12 打开）有一个 "Sources" 选项卡，其中
正确指向写入目录中我的Haxe源文件
用简单的语法高亮显示源代码
允许我在 haxe 代码中添加断点
AND 让我在到达断点时用鼠标突出显示变量（包含的对象）的值（就像您在 Visual Studio 或其他花哨的 IDE 中看到的那样）
那么 Google Chrome 到底是怎么做到的呢？我的 "launch script" 是这样的：
"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" "http://localhost:8080/mysite"
可能 解释了它是如何找到我的源目录的，因为该脚本是 运行 从那里找到的。这并没有解释 Google Chrome 如何理解 Haxe，或者知道如何逐行匹配生成的 javascript 代码与源 Haxe 代码。
我没有安装任何 Haxe 插件。我拥有的唯一与开发相关的插件是 Advanced REST 客户端和 Javascript Errors Notifier（它只是在出现 javascript 错误时添加一点视觉指示器）
这一切看起来像是（非常有用的）黑魔法。
我从未使用过 Haxe，但我认为它只是吐出常规的源映射（将源映射 variables/lines 编译），所有主流浏览器都可以解释这些映射。要了解更多信息，我推荐这篇文章：html5rocks.com/en/tutorials/developertools/sourcemaps