2023-03-19

Browsers Launched Through VSCode Never Load React Sarted With react-scripts start

Until last night, I used to just hit F5 in VS code and debug my react app (typescript, run with PORT=4200 BROWSER=none react-scripts start by way of npm start).

App: https://github.com/micahg/ntt

I'm physically running NPM in wsl2 and the browsers access it via localhost on windows. Hasn't been an issue this far...

Now when I launch the frontend from code, the browser launches but never loads the page. I can reproduce this across edge or chrome, using a launch config that looks like this:

        {
            "type": "chrome",
            "request": "launch",
            "name": "Launch against localhost",
            "url": "http://localhost:4200",
            "webRoot": "${workspaceFolder}",
        }

If I refresh/reload in browser and look at the traffic, it looks like I get a response to GET / (http 200) but there is no body. The tab's loading animation is spinning around too so it seems like its waiting for a response to the call to http://localhost:4200/ but it never comes. Page is blank -- i think maybe I really am not getting a response in THAT browser.

What is really confusing is that it seems (somehow) tied to vscode. If I hit the same url outside of WSL through curl, chrome, firefox, edge, netscape navigator, etc started through normal means everything is fine. Anything launched within code... never actually fetches the response body.

I realize this post might be a little light on detail but I'm not really sure what info would help... I'm about to get wireshark out over here just to prove I'm not insane, but if anyone has any suggestions I'd take them as this is so bizarre (or I've overlooked something monumentally).

I did have a look at https://create-react-app.dev/docs/advanced-configuration/ but there doesn't seem to be a verbose mode or traffic log or anything.

Thanks in advance,



No comments:

Post a Comment