loading...

Chrome debugger breakpoints not working with create-react-app

kvharish profile image K.V.Harish ・1 min read

A few days ago I came across a weird issue with my Chrome debugger when I was working on my ReactJS application created using create-react-app(3.4.1) and I did some logical error so as always I kept a breakpoint at the line of suspicion to check the issue and kept updating the code as the server was running. For some reason, the debugger was not pausing at the breakpoint. I went around searching the internet to find if any other person has faced a similar issue or it was just me.

I found an open issue in create-react-app with the Chrome debugger breakpoints https://github.com/facebook/create-react-app/issues/6074. A fix was released but later reverted due to an issue with Webpack.

One suggested workaround is to add --no-cache in your package.json which worked for me

From

"scripts": {
  "start": "react-scripts start",
  "build": "react-scripts build",
  "test": "react-scripts test",
  "eject": "react-scripts eject"
}

To

"scripts": {
  "start": "react-scripts start --no-cache",
  "build": "react-scripts build",
  "test": "react-scripts test --no-cache",
  "eject": "react-scripts eject"
}

If this does not work for you, you can try other suggestions under the issue in the GitHub.

From the ongoing discussion it seems like we will have to wait for a while for the issue to be fixed.

Posted on by:

kvharish profile

K.V.Harish

@kvharish

Frontend developer and aspiring Fullstack developer from India. Loves to have ☕ any time of the day.

Discussion

markdown guide
 

Good sharing and got insight, I would suggest you to keep posting like this interesting stories.