javascript - 使用 Webpack 编译脚本后控制台中出现更好的错误

Question

我现在已经偶然发现它好几次了，我在控制台中收到一个错误，而且我无法在没有疯狂猜测的情况下弄清楚它的来源。比如这里的错误:

我可以看到有 this NPM-package here在编译时显示更好的 Webpack 错误。但我正在寻找可以更轻松地跟踪控制台中触发错误的代码部分的东西。

就像上面显示的错误。为什么它不传递字符串，而是试图作为 SVG 传递？我点击了错误中显示的所有链接，但最接近帮助的是最后一行，它是调整视口(viewport)大小时正在执行的函数。

有没有一种方法可以让我更轻松地了解导致给定错误的原因？

---

加法 1:

或者像这样的错误:

为什么不写下获取“空目标”的行，这样开发人员就可以使用一些东西了。这就像在说:“你的代码中某处有一个空目标”。去想办法。 :-/

我知道这是一项艰巨的任务，但我是唯一遇到此问题的人吗？

Answer 1

@Zeth，我认为您正在寻找源 map !它将从编译输出中的行指向源文件中的行。

查看这些以获取更多信息:

• https://webpack.js.org/configuration/devtool/
• https://developer.mozilla.org/en-US/docs/Tools/Debugger/How_to/Use_a_source_map