0
310
ViewsCrbug/1173575, non-JS module files deprecated. chromewebdata/(index)꞉5305:9:5551
I just created a new project and have run it for the first time using F5 or Ctrl + F5, the result in Chrome is:
The site can't be reached
err_connection_refused
I checked the option at the breakpoints for "Exceptions caught" and the following error is displayed.
Without "Exceptions caught" checked, the next error raised:
I tried to run "ng s -o" from the terminal and all work fine. The site is working well on port 4200, but I like to debug.
Here is my launch.json file, all by default:
{
// Use IntelliSense to learn about possible attributes.
// Hover to view descriptions of existing attributes.
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
"version": "0.2.0",
"configurations": [
{
"type": "pwa-chrome",
"request": "launch",
"name": "Launch Chrome against localhost",
"url": "http://localhost:4200",
"webRoot": "${workspaceFolder}"
}
]
}
Why is this happening?
3 answers
Answer question0
I had the same issue and the problem was with the URL, it was https://localhost:8000; in place of http://localhost:8000.
So try checking your URL and routes.
0
This is a tricky one. The fact that there are (as of this date 21-Jan-2022) 275k view, 55 upvotes, 41 answers (mostly with zero upvotes) of people who found a highly specific fix and no actually accepted answer indicates it is probably a misleading error message, that gets triggered when something bad and unexpected happens. With me that turned out to be the case.
This error seemingly has nothing to do with Chrome or any deprecitated functionality. It seems to occur whenever connectivity can't be established.
I got this while following the React tutorial for VS Code. In that tutorial you start by creating a template with npx then running it with npm start. That worked and I could see that it was using http://localhost:3000 for the URL in the browser.
However when I changed the code as the tutorial requested and set a breakpoint to debug, I got the error in the OP's post, both with Chrome and with Edge.
Eventually after much research I found out that VS Code was creating a default launch.json for debugging and populating it like this:
{
// Use IntelliSense to learn about possible attributes.
// Hover to view descriptions of existing attributes.
"version": "0.2.0",
"configurations": [
{
"type": "pwa-chrome",
"request": "launch",
"name": "Launch Chrome against localhost",
"url": "http://localhost:8080",
"webRoot": "${workspaceFolder}"
}
]
}
And I needed to manually change the 8080 to 3000 which fixed the problem.
Key for me was configuring the breakpoint to catch the exception like the OP described (note - you can only configure that with the Debug icon selected in the far left icon menu). While the emitted error message is still the misleading "depreciated" one, there was a message that "the site can't be reached" which you can find if you dig a little - as shown here:
I image that practically any configuration issue that causes the connection to fail will cause this error. So firewall issues, missing host program, bad configuration (like mine), etc.
Good luck on your journey to find your own version of the answer to this problem and hope this helps.
0
I also had this issue and none of the solutions listed were helpful. However the problem was rather easy to solve.
Just go into the Network tab of the Chrome Developer Console. Be sure that the connection is on No throttling and not Offline.
