调试 Vue 运行时错误的技巧

Question

我有一个错误在运行期间出现在控制台中，但它正在构建并且我的 linting 过程没有问题。

Uncaught SyntaxError: missing ) after argument list
    at Object.<anonymous> (app.js:958)
    at __webpack_require__ (app.js:708)
    at fn (app.js:113)
    at eval (store.js?adc6:1)
    at Object.<anonymous> (app.js:913)
    at __webpack_require__ (app.js:708)
    at fn (app.js:113)
    at eval (router.js?15ee:1)
    at Object.<anonymous> (app.js:1155)
    at __webpack_require__ (app.js:708)

我知道这是我的代码的问题，任何人都不可能告诉我问题出在哪里，但我正在寻找有关如何调试它的建议。我已经检查了我最近更改的所有文件，但找不到错误。

对于无需遍历每一行代码即可找到此错误根源的过程，有没有人有任何建议？

Answer 1

如果你使用的是 vue 2.5+，你可以实现一个新的错误处理功能

这是发行说明的 link：https://gist.github.com/yyx990803/9bdff05e5468a60ced06c29c39114c6b#error-handling-with-errorcaptured-hook

简而言之，您可以将 errorCaptured 添加到您怀疑会抛出错误的组件中

errorCaptured (err, vm, info) {
    this.error = `${err.stack}\n\nfound in ${info} of component`
    return false
}

这应该会减少您查找错误所花费的时间

调试 Vue 运行时错误的技巧

Tips on debugging Vue runtime error

vue.js

vuejs2

quasar-framework