debugging - Visual Studio Code debugger with Chrome refused to connect to localhost

Question

I've tried several suggestions on other posts to no avail.

I have a 9 month old project that no longer shows in the browser from F5 debugging in vs code.

I set up a brand new simple project with an index.html file to try to get Visual Studio code to launch it in a Chrome browser window.

I keep getting an error page in chrome that says:

This site can’t be reached localhost refused to connect. Did you mean http://localhost8000.com/? Search Google for localhost 8000 ERR_CONNECTION_REFUSED

launch.json:

    {
    // 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": "chrome",
            "request": "launch",
            "name": "Launch Chrome against localhost",
            "url": "http://localhost:8000",
            "webRoot": "${workspaceFolder}"
        }
    ]
}

index.html:

hello world!!!!!

Any help would be greatly appreciated!

Answer 1

If anyone else is having this issue, I solved it by:

1)installing the ritwickdey/vscode-live-server available here: vscode-live-server link

2) restarting vscode

3) clicking the Go Live button at the bottom of the screen

4) getting the server address from the resulting Chrome window (ex: http://localhost:5500/)

5) changing the .vscode/launch.json file to include that server address:

{
    "version": "0.2.0",
    "configurations": [

        {
            "type": "chrome",
            "request": "launch",
            "name": "Launch Chrome against localhost",
            "url": "http://localhost:5500",
            "webRoot": "${workspaceRoot}"
        }
    ]
}

6) creating(or editing) a settings.json file with the following json:

{
    "liveServer.settings.port": 5500,
    "liveServer.settings.CustomBrowser" : "chrome",
    "liveServer.settings.AdvanceCustomBrowserCmdLine": "chrome --incognito --remote-debugging-port=9222",
    "liveServer.settings.NoBrowser" : false,
    "liveServer.settings.ignoreFiles" : [
            ".vscode/**",
            "**/*.scss",
            "**/*.sass"
    ]

}

7) switching to vscode's debug pane on the left and pushing the green arrow next to "Launch Chrome against localhost"

Hope this helps someone else out!