Coffeescript中的源映射 - 未映射到源的错误

Question

我刚刚意识到源映射 - 一个期待已久的功能.令人印象深刻的是,很多人聚在一起为咖啡脚本(浏览器,kickstart项目等......)做到了这一点.

我设置了一个小测试,所以我可以理解如何使用它...

CoffeeScript的

注意,这里有一个故意的错误,因为y没有定义

console.log 123

sq = (x)->
  x * x

console.log "thats how easy: "+sq y

来源地图

{
  "version": 3,
  "file": "test.js",
  "sourceRoot": "",
  "sources": [
    "test.coffee"
  ],
  "names": [],
  "mappings": ";AAAA;CAAA,CAAA,IAAA;CAAA;CAAA,CAAA,CAAA,IAAO;;CAAP,CAEA,CAAK,MAAC;CACJ,EAAI,QAAJ;CAHF,EAEK;;CAFL,CAKA,CAAA,IAAO,WAAK;CALZ"
}

使用Javascript

// Generated by CoffeeScript 1.6.1
(function() {
  var sq;

  console.log(123);

  sq = function(x) {
    return x * x;
  };

  console.log("thats how easy: " + sq(y));

}).call(this);
//@ sourceMappingURL=test.map

玉

html
  head
    script(src="test.js")
  body
    h1 Test Page

这一切似乎都有效,因为显示了咖啡脚本源,我甚至可以设置断点(但图形似乎没有显示,并且在javascript中设置断点的位置似乎有些不稳定).

我遇到的问题是,当出现错误时,控制台会报告javascript文件的行号.如何找出导致错误的咖啡脚本源文件的行？

我在OSX 10.8.2上使用Google Chrome版本23.0.1271.101

Answer 1

实际上我只是回答了我自己的问题，与你的问题非常相似。你可以在这里看看。

我使用的解决方案是使用 browserify 连接/编译所有的 CoffeeScript，使用 Coffeeify 作为转换选项。当在 browserify 中将 debug 设置为 true 时，所有行号都应映射回原始 CoffeeScript 源中的正确行。