javascript - Chrome 中的解析错误

Question

<script type="module" id="user-code">

try {
    someUnknownReference;
} catch (error) { 
    console.log(error) // correct
    console.log(error.toString()); // incorrect
    console.log(error.stack.toString().split('\n')); // incorrect - line number and filename is wrong
}
  
    //# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImluZGV4LmpzIl0sIm5hbWVzIjpbImxrc2xrcyJdLCJtYXBwaW5ncyI6IkFBQUFBLE1BQU0iLCJmaWxlIjoiYnVuZGxlLmpzIiwic291cmNlc0NvbnRlbnQiOlsibGtzbGtzIl19
</script>

我正在使用 Babel 构建一个基于浏览器的代码编辑器。一切正常，但我终生无法从运行时发生的错误中提取行号和文件名。

上面的示例是我正在做的事情的简化版本。我正在将一个字符串注入(inject) script 标签，例如 scriptTag.innerHTML = bundledCode;

第一个 console.log 准确地打印出我想要解析的内容，例如它具有从 sourcemap 获取的文件名和正确的行号

ReferenceError: someUnknownReference is not defined
    at index.js:1

但是，一旦我尝试对错误执行任何操作，例如第二个 console.log，我就会丢失行号和文件名。

ReferenceError: someUnknownReference is not defined

我的猜测是，当我们尝试解析对象时，它可能会丢失对 sourcemap 的引用？

在此先感谢您的帮助!

Answer 1

如果您在控制台记录错误，我认为 Chrome 控制台会自动使用源映射来提供正确的错误消息。如果您要捕获实际的字符串，则不会。你需要这样的东西吗:https://www.npmjs.com/package/sourcemapped-stacktrace ？