Tips on debugging Vue runtime error

Question

I have an error that is showing up in the console during run-time, but it is building and there is no problem with my linting process.

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

I get that this is a problem with my code and that it's not going to be possible for anyone to tell me where the issue is, but I'm looking for advice on how to debug this. I've gone through all of the files I've changed recently and can't find the error.

Does anyone have any suggestions for a process for finding the source of this error without trawling through every line of code?

user_197546 · Answer

If you're using vue 2.5 +, you can implement a new error handling feature

here is the link to the release notes: https://gist.github.com/yyx990803/9bdff05e5468a60ced06c29c39114c6b#error-handling-with-errorcaptured-hook

in short, you can add errorCaptured to your component(s) that you suspect to be throwing the error

errorCaptured (err, vm, info) {
    this.error = `${err.stack}

found in ${info} of component`
    return false
}

this should reduce the time you spend looking for errors

Tips on debugging Vue runtime error

1 Answers