Menu
I am on Windows 10. I was having no luck getting an Angular2 app working with VsCode Chrome debugging extension. I stripped the app down to a non-Angular app with just 2 files, but still no progress.
My breakpoints don't get hit and I still get the Error: Cannot connect to runtime process, timeout after 10000 ms - (reason: Cannot connect to the target: connect ECONNREFUSED 127.0.0.1:9222)"
These are my current two source files:
index.html
<!DOCTYPE html>
<html>
<body>
<h1>External JavaScript</h1>
<p id="demo">A Paragraph.</p>
<button type="button" onclick="myFunction()">Try it now</button>
<p><strong>Note:</strong> myFunction is stored in an external file called "myScript.js".</p>
<script src="myScript.js"></script>
</body>
</html>
MyScript.js
function myFunction() { document.getElementById("demo").innerHTML = "Paragraph changed."; }
My launch.json file contains:
{
"version": "0.2.0",
"configurations": [
{
"name": "Launch Chrome against localhost, with sourcemaps",
"type": "chrome",
"request": "launch",
"url": "http://localhost:3000",
"sourceMaps": true,
"webRoot": "${workspaceRoot}"
},
{
"name": "Attach to Chrome, with sourcemaps",
"type": "chrome",
"request": "attach",
"port": 9222,
"sourceMaps": true,
"webRoot": "${workspaceRoot}"
}
]
}
I start lite-server in a command window. As soon as I start it, a tab opens inside IE which happened to be already running. Inside the address bar is "http://localhost:3000/" The app runs fine. (What exactly is making this connection to IE? Could this conflict with the Chrome extension?)
I close out the IE tab and then go to Debug in VsCode. I set the configuration to "Launch Chrome against localhost...". I press F5 to start debugging. It opens a Chrome window and browses to "localhost:3000".
The app runs fine but my breakpoints don't get hit and I get an error in VSCode: "Error: Cannot connect to runtime process, timeout after 10000 ms - (reason: Cannot connect to the target: connect ECONNREFUSED 127.0.0.1:9222)"
It seems to be trying to use the 3rd configuration "Attach to Chrome...". But the dropdown was set to the second "Launch Chrome ...". I also make sure any running copies of Chrome are killed before hit F5.
I should also mention that I can create a node.js app in VsCode and the breakpoints work fine because of the built-in support.
576
Right click the Chrome shortcut, and select properties In the "target" field, append --remote-debugging-port=9222 or in a command prompt, execute /chrome.exe --remote-debugging-port=9222.
55
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
