Setting breakpoints and hitting the first breakpoint is now very slow in vscode when debugging a React app

Viewed 1081

That used to work much better a couple days ago, but now, when I want to debug my CRA webapp in Chrome, I have big delays (10 - 20 seconds) when setting or hitting breakpoints. Right now I even got a message from vscode

enter image description here

saying that

It's taking a while to configure your breakpoints. You can speed this up by updating the 'outFiles' in your launch.json".

The thing is: I don't have out files when debugging a react application.

What do I have to set there instead? Side note: I'm using the built-in Chrome debugger support instead of the deprecated Chrome extension.

1 Answers

It turned out that including the Typescript source maps in the production build caused the long delays. These files are very large (larger than the actual code) and hence require pretty long to be loaded.

In my project I enabled source maps as part of the Babel builds. This way I can debug Typescript code in a Visual Studio Code Web view.

Related