create-react-app: Hot reloading doesn't update Chrome sourcemaps

We have not merged hot reloading support yet but I noticed a very unfortunate issue: Chrome doesn’t update sourcemaps.

See how the Hello in browser Sources pane doesn’t change.

Note that if we change Webpack devtool setting from cheap-module-source-map to eval it will update on hot reloads:

It used to be broken too but at some point Chrome fixed it. I remember chatting with @paulirish about it in the past.

However we can’t switch to eval mode because we need the source mapping.

We should reach out to somebody at Chrome and figure out if this is fixable. We can live with the broken behavior for a while but if it’s not possible to fix later, then hot reloading experience would be confusing.

About this issue

Original URL
State: closed
Created 7 years ago
Reactions: 2
Comments: 27 (10 by maintainers)

Commits related to this issue

fixed source maps on hot reload for more background on the issue check: https://github.com/facebookincubator/create-react-app/issues/2407 — committed to kaliberjs/build by EECOLOR 7 years ago

Most upvoted comments

The fix for crbug.com/438251 has landed and will be available on tomorrow’s Canary.

+13

aslushnikov on Jan 22, 2018

update chrome Version 66.0.3359.117(64-bit) , the bug has fixed. 🙂

Dcatfly on Apr 20, 2018

@onpaws : fwiw, I can verify that a copy of Chrome 66 correctly updates sourcemaps on hot reloading in my own non-CRA app.

markerikson on Mar 13, 2018

We did poke them a few times. I think the issue even got a patch and it has a milestone. So I’m hopeful 🙂

gaearon on Jan 16, 2018

@gaearon yeah, just change the Webpack config to include:

{
  // ...
  output: {
    // ...
    sourceMapFilename: "[file].map?[contenthash]"
  }
}

This will use the workaround which makes the sourcemaps work in Chrome together with cheap-module-source-map.

niieani on Jun 23, 2017