VS code breakpoints failing to trigger using Debugger for Chrome:
Question
I'm new to VS Code (using v1.7) and to JavaScript. I'm trying to use the Debugger for Chrome extension (v2.2.2) but I am unable to get breakpoints to function (I can set them but they are ignored stating unverified breakpoint).
I understand that I need to launch Chrome with debugging on port 9222 which I achieve through:
chrome.exe --remote-debugging-port=9222
Having done that I've set up a very simple test to demonstrate the problem.
I've configured the launch.json as follows (in the .vscode folder)
{
"version": "0.2.0",
"configurations": [{
"name": "Launch index.html",
"type": "chrome",
"request": "launch",
"port": 9222,
"file": "${workspaceRoot}/index.html",
"webRoot": "${workspaceRoot}"
}
]
}
I've created a very simple index.html as:
<!DOCTYPE html>
<html>
<script src="script.js"></script>
</html>
and finally script.js is:
console.log("Started");
var x = 1; //breakpoint set here
console.log(x);
console.log("Complete");
Pressing F5 in Code then load index.html running script.js in the process. The code finishes as would be expected if the breakpoint wasn't set - but it's not what I want to happen.
On completion, I see image 1 which replaces the red breakpoint icon with a grey one and hovering over shows "Unverified breakpoint".
I imagine I've done something really simple wrong, but I can't figure it out. Any ideas? Thanks.
1 answers
solution1
2 2016-11-20 10:58:21
It seems like your setup is correct, but this is due to a bug in chrome dev tools - Chrome needs to be refreshed before javascript files are shown in the sources tab
What's happening?
After the script executes V8 collects it before the chrome debug extension has started the dev tools. That's why it cannot be debugged.
Solution - reload the page after it's loaded.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.