“Unbound breakpoint” on running Node.js project.

When you debugging your node.js project, you can set a breakpoint on your back-end code like this.

I know, the breakpoint’s position is weird, but it works correctly.

But, if you tried to set a breakpoint in your client-side code same time, it would be just grey unfilled circle with “Unbound breakpoint”

I’ve searched to fix this issue, but many articles suggested a pre-compiler like a babel. But I don’t want to mess up my project with several “high-techs”.

What you need to do this situation, that is just simple.

You should set a breakpoint two kind of these ways.

1. put on “debugger”

If you insert a simple line “debugger” into the position as you wish to make a breakpoint, Chrome would stop in exact same position.

2. set breakpoint in Chrome

By the way, you’re able to set your breakpoint into the chrome inspector directly. after setting a breakpoint, it will be maintained after refresh the page.

That’s all. Use a vscode for back-end breakpoint, and use chrome for a front-side breakpoint.