fix(gatsby): fix hot-reloading for hooks (patch hmr)

[wardpeet]

Should fix hot-reloading issues for new react features (hooks) and also fix the issue with You must provide the URL of lib/mappings.wasm. A few packages use isomorphic-fetch which polyfills global.fetch.

The source-map package doesn't deal with pollyfilled versions so it will go for the web version instead of trying to load wasm with nodejs. (https://github.com/mozilla/source-map/blob/0.7.3/lib/read-wasm.js#L1). It's fixed in 0.8.0-beta but it hasn't been released for a while so for now I manually monkey patch the hmr package.

// error:

error UNHANDLED REJECTION

  Error: You must provide the URL of lib/mappings.wasm by calling SourceMapConsumer.initialize({ 'lib/mappings.wasm': ... }) before using SourceMapConsumer
  
  - read-wasm.js:8 readWasm
    [www]/[react-hot-loader]/[source-map]/lib/read-wasm.js:8:13
  
  - wasm.js:25 wasm
    [www]/[react-hot-loader]/[source-map]/lib/wasm.js:25:16
  
  - source-map-consumer.js:264 BasicSourceMapConsumer.then.that
    [www]/[react-hot-loader]/[source-map]/lib/source-map-consumer.js:264:14

You can test this PR on gatsby-www or create a new starter and include isomorphic-fetch inside gatsby-config.js

References:
#13610 (comment)
#13641

[wardpeet]

I'll also create a PR on react-hot-reloader, might not get accepted but than we can remove our monkey patch in a next version of gatsby.

[mbifulco]

Hey @wardpeet - I'd love to test this on a project that's giving me trouble. How can I reference your PR in package.json to pull in this specific version of gatsby?

[wardpeet]

it's not that easy, you'll need to follow https://www.gatsbyjs.org/blog/2018-04-11-trying-out-gatsby-at-work-and-co/#branching-off which might give you insights on how to.

[sidharthachatterjee]

🤦‍♂

[sidharthachatterjee]

Thank you as always @wardpeet 🥇

[sidharthachatterjee]

Published in [email protected]