Question

我正在设置一个调试coffeescript文件的环境。我正在使用IDE，webstorm，它从原始的.coffee文件生成.js文件和.map，来自coffeescript默认编译器。

所以我最终将4个文件放在同一个文件夹中：

main.html，aa.coffee，aa.js，aa.map。在main.html中我包含了js文件。 JS文件包含：

// Generated by CoffeeScript 1.6.3
var my;

my = 1;

alert(my);

/*
//@ sourceMappingURL=aa.map
*/

很简单。加载main.html时，它会正确弹出警报。现在，当我打开谷歌开发工具/源码，在那里我看到我的文件树，我看到了html文件和js文件。但是出现.coffee文件是不可能的，尽管如上所述正确引用。当然，我确实在dev工具设置中启用了sourcemap。我看了几个视频教程，然后我为咖啡文件做了所有步骤。

以下是其他2个文件的内容：

.coffee：

my = 1
alert my

.map：

{
"version": 3,
"file": "aa.js",
"sourceRoot": "",
"sources": [
"aa.coffee"
],
"names": [],
"mappings": ";AAAA,EAAA,EAAA;;AAAA,CAAA,CAAA,CAAK;;AACL,CADA,CACA,GAAA"
}

您是否知道为什么源地图流程无法在chrome dev工具上运行？

Answer 1

编辑：我现在已经改变了所有这一切，并且根本不使用源映射调试。首先，它通常是片状的。其次，如果我不写JS，我至少应该能够阅读它，所以我总是在js中调试。

首先，请记住，目前Chrome中的源地图调试很不稳定。你可以试试几件事：

在代码中放置一个调试器语句。我注意到调试非常不稳定 - 大约10％的时间它不会在断点上停止。
直接在源窗格中按Ctrl O打开咖啡文件，然后放置断点或使用调试器语句。
找出"sourceRoot": "",为空的原因。这可能意味着源文件将与js文件位于同一目录中（似乎很可能）。我的咖啡文件位于不同的目录中，因此它们具有sourceRoot条目。
使用grunt或coffeescript生成源地图。但这似乎不太可能产生影响。

我打赌＃2会这样做。

如何使用google chrome debug dev工具查看coffeescript文件？

1 个答案: