[docs site] Webassembly Error When Building

[hydrosquall]

Description

Documentation site was unable to build locally, encountered while trying to test #13640

Steps to reproduce

Following the directions in the docs contributions page

Expected result

Build completes without error

Actual result

cd www/
yarn install
yarn run develop

$ GATSBY_GRAPHQL_IDE=playground gatsby develop
success open and validate gatsby-configs — 0.011 s
success load plugins — 0.659 s
success onPreInit — 0.007 s
success initialize cache — 0.006 s
success copy gatsby files — 0.041 s
success onPreBootstrap — 0.015 s
success source and transform nodes — 3.982 s
success building schema — 1.366 s
success createPages — 1.387 s
success createPagesStatefully — 0.066 s
success onPreExtractQueries — 0.002 s
success update schema — 0.091 s
success extract queries from components — 0.371 s
success run static queries — 0.030 s — 4/4 136.43 queries/second
success run page queries — 0.061 s — 9/9 149.28 queries/second
success write out page data — 0.033 s
success write out redirect data — 0.001 s
success Build manifest and related icons — 0.176 s
success onPostBootstrap — 0.177 s

info bootstrap finished - 10.044 s

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
  

Environment

  System:
    OS: macOS High Sierra 10.13.6
    CPU: (12) x64 Intel(R) Core(TM) i7-8850H CPU @ 2.60GHz
    Shell: 5.3 - /bin/zsh
  Binaries:
    Node: 11.13.0 - /usr/local/bin/node
    Yarn: 1.13.0 - /usr/local/bin/yarn
    npm: 6.9.0 - /usr/local/bin/npm
  Languages:
    Python: 3.7.1 - /Users/cameron/.pyenv/shims/python
  Browsers:
    Chrome: 74.0.3729.108
    Safari: 12.1
  npmPackages:
    gatsby: ^2.3.0 => 2.3.31 
    gatsby-image: ^2.0.5 => 2.0.40 
    gatsby-plugin-canonical-urls: ^2.0.5 => 2.0.12 
    gatsby-plugin-catch-links: ^2.0.2 => 2.0.13 
    gatsby-plugin-emotion: ^4.0.3 => 4.0.6 
    gatsby-plugin-feed: ^2.0.5 => 2.1.1 
    gatsby-plugin-google-analytics: ^2.0.5 => 2.0.18 
    gatsby-plugin-google-tagmanager: ^2.0.5 => 2.0.13 
    gatsby-plugin-guess-js: ^1.0.0 => 1.0.6 
    gatsby-plugin-layout: ^1.0.10 => 1.0.15 
    gatsby-plugin-mailchimp: ^2.2.3 => 2.2.3 
    gatsby-plugin-manifest: ^2.0.2 => 2.0.29 
    gatsby-plugin-netlify: ^2.0.0 => 2.0.15 
    gatsby-plugin-netlify-cache: ^0.1.0 => 0.1.0 
    gatsby-plugin-nprogress: ^2.0.5 => 2.0.10 
    gatsby-plugin-offline: ^2.0.22 => 2.0.25 
    gatsby-plugin-react-helmet: ^3.0.0 => 3.0.12 
    gatsby-plugin-sharp: ^2.0.5 => 2.0.35 
    gatsby-plugin-sitemap: ^2.0.1 => 2.0.12 
    gatsby-plugin-twitter: ^2.0.5 => 2.0.13 
    gatsby-plugin-typography: ^2.2.0 => 2.2.13 
    gatsby-remark-autolink-headers: ^2.0.10 => 2.0.16 
    gatsby-remark-code-titles: ^1.0.2 => 1.0.2 
    gatsby-remark-copy-linked-files: ^2.0.5 => 2.0.12 
    gatsby-remark-embed-video: ^1.7.0 => 1.7.1 
    gatsby-remark-graphviz: ^1.0.0 => 1.0.9 
    gatsby-remark-images: ^2.0.1 => 2.0.6 
    gatsby-remark-normalize-paths: ^1.0.0 => 1.0.0 
    gatsby-remark-prismjs: ^3.0.2 => 3.2.8 
    gatsby-remark-responsive-iframe: ^2.0.5 => 2.1.1 
    gatsby-remark-smartypants: ^2.0.5 => 2.0.9 
    gatsby-source-airtable: ^2.0.6 => 2.0.8 
    gatsby-source-filesystem: ^2.0.1 => 2.0.32 
    gatsby-source-npm-package-search: ^2.0.0 => 2.0.5 
    gatsby-transformer-csv: ^2.0.0 => 2.0.8 
    gatsby-transformer-documentationjs: ^3.0.0 => 3.0.1 
    gatsby-transformer-remark: ^2.2.5 => 2.3.12 
    gatsby-transformer-screenshot: ^2.0.4 => 2.0.13 
    gatsby-transformer-sharp: ^2.1.1 => 2.1.18 
    gatsby-transformer-yaml: ^2.1.1 => 2.1.12 
  npmGlobalPackages:
    gatsby-cli: 2.4.8

[hydrosquall]

After searching around for this error message, it seems like this issue is possibly related, something related to interactions between React Hooks and the React Hot Loader.

gaearon/react-hot-loader#1088 (comment)

[joealden]

I am also seeing this error in a private Gatsby project. It looks like this release is the culprit: 25a36d3.

[IvanKovnovic]

I've updated my Gatsby project to [email protected], but I still get the same error.

[joealden]

@IvanKovnovic 2.3.31 is the release that caused this to break. Rollback to 2.3.30 or earlier until a fix for this is released.

[jsjoeio]

For anyone who comes here after me, I rolled back Gatsby to 2.3.30 and still see the same error. I had to rollback to 2.3.29

npm install [email protected]

[joealden]

@jsjoeio are you sure about that? 2.3.31 is the version that introduced the change that causes this error, so I can't see why 2.3.30 would be effected by this. Did you ensure that you actually had 2.3.30 installed locally?

[jsjoeio]

@joealden to give you some context, I was trying to help a friend with this issue. I cloned his repo and was having problems running gatsby develop then found this issue, tried rolling back Gatsby and hence, found it didn't work with 2.3.30 (unless I did something else that would have caused this same Webassembly error.)

So the answer is, I'm not sure. My intention behind commenting on this was to help anyone else who couldn't fix it by rolling back to 2.3.30.

[joealden]

@jsjoeio if I came off a bit abrasive in my above comment, I didn't mean to, so sorry if I did.

I was only commenting as I didn't see how the issue would still exist when having 2.3.30 installed.

I've have since tested it locally and can say with a high degree of confidence that 2.3.30 doesn't cause this error, so I think you must have accidentally still had 2.3.31 installed without realising it.

I'm clarifying this so the devs know exactly what caused this issue, and can potentially solve it more efficiently.

[jsjoeio]

@joealden no worries at all! I know you were just trying to clarify.

Glad you made that point. I think you're right right about that. I must have still been using 2.3.31.

Hoping all of this contributes to us solving it as a community!

[wardpeet]

Rolling back the commit, sorry about this. I make sure to have a proper test case in place and try to fix hmr with hooks in a newer PR.

[wardpeet]

[email protected] should fix your issues. We rolled back the PR that caused this. Sorry for the inconveniences it may have caused.

[joealden]

@wardpeet this rollback fixed the issue. I think this issue is safe to close for now.

[wardpeet]

Do you mind testing #13713 or if possible share your repo so we can test the PR ourselves and see if we actually fixed the issue so we don't break it again.

[joealden]

@wardpeet unfortunately the repo that it is failing on for me is a private work related project, so I can't really give you access to it. When I get some free time today, I'll test this PR with this repo myself.

[joealden]

@wardpeet I can confirm that #13713 works fine, and doesn't error out in my project.

[wardpeet]

Thanks that's super valuable feedback! Let me close this one out. Thanks again! 🎉

[joealden]

@wardpeet no problem! Looking forward to this PR being merged!

Also, something I forgot to mention, I read the PR description and saw that you mentioned the underlying issue was with a fetch function check, and it caused an error to be thrown when a project polyfilled the fetch function in the node environment. This was indeed the case with the project I am working on, as we use isomorphic-fetch to polyfill the fetch function for react-apollo SSR support. Just thought that would be good info to have!

[maks112v]

I am adding prismic sourcing and get this issue.