调试器使用源映射显示错误信息答案

【问题标题】：Debugger showing wrong information with source maps调试器使用源映射显示错误信息
【发布时间】：2014-08-23 10:06:40
【问题描述】：

这已经是第二次发生了，正如您可以想象的那样，显示错误信息的调试器是调试时可能发生的最糟糕的事情。发生的情况是，当使用源映射时，调试器认为 VM 位于某一行，但实际上它还不存在，或者更糟糕的是，永远不会到达这一行。源映射是使用 Grunt uglify 插件生成的，该插件使用 UglifyJS2。

一个例子：

if(something === 1){
    console.log("it's something"); // debugger thinks the VM is here
else{
    console.log("no it's not");    // while actually it's here
}

这确实打印了no it's not，尽管调试器跳转到if

我遇到的另一个例子是：

var that = this;
some.functionCall(1, function(){
    console.log(that);  //this is where the debugger thinks the vm is
    // debugger: that = undefined
    // console prints nothing to that point
});

当我继续程序时，console.log(that) 最终触发了。

有没有其他人遇到过同样的问题？更可能是 UglifyJS2 的问题还是 Google Chrome 的问题？

Chrome 版本：38.0.2125.8 开发版（64 位）
Uglify2JS：2.4.0
grunt-contrib-uglify：0.5.1

【问题讨论】：

标签： javascript google-chrome debugging source-maps uglifyjs2

【解决方案1】：

我观察到类似的问题。偏移量正好等于注释行数。

EDIT 根本原因是出现在第 3 方库中以 //>> 为前缀的行。每一条这样的线都会产生 1 线偏移。它们似乎是一些贬值的 requirejs 构建编译指示。

对我们来说，解决方案是在构建时在代码中查找和替换它们，因为我们在构建系统中不使用编译指示。

sed -i -e 's_//>>_// pragma was here: _g' `find . -type f -name "*.js"`

【讨论】：

问题是是 chrome 还是 uglifyjs 问题...将进一步调查