1

I am new to Vue.js, and I am loving it. Previously I used JQuery and having to do everything manually was very inefficient. I liked, however, having the code I wrote in the Chrome debugger so that I could add breakpoints and see what was happening anywhere in my application.

Now I moved to Vue.js, and I am using vue-cli and npm to create, and build a Vue application that generates the actual app code under dist/build.js. I have a method within one Vue component which is not showing any error, but is not behaving as expected.

Is it possible to add a breakpoint within that method so that I see what it is receiving and how it is handling it, running it step-by-step?

From what I have seen, the source code I wrote in the Vue component is within build.js, inside a loooong string within an eval function.

5
  • 1
    Add debugger at the beginning of your method? Commented Mar 25, 2017 at 11:55
  • thanks! that was easy! Would like to add the answer? Commented Mar 25, 2017 at 12:00
  • btw is that a vue functionality or an npm one? Commented Mar 25, 2017 at 12:01
  • @AmreshVenugopal Commented Mar 25, 2017 at 12:05
  • 1
    Sure, I'll cover all these details in the answer. :) Commented Mar 25, 2017 at 12:12

1 Answer 1

3

To debug your js applications you can add a debugger statement, it adds breakpoints to your code where applied.

The debugger statement invokes any available debugging functionality, such as setting a breakpoint. If no debugging functionality is available, this statement has no effect.

Source

It is a javascript feature, which got it's initial definition in ECMAScript 5.1

Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.