react-static: [Bug] 7.0.10 in development causes SourceMapConsumer.initialize errors

Reporting a bug?

After upgrading from 7.0.9 to 7.0.10 my development environment fails to build giving the following error:

  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
    [react-static-prismic-v7]/[react-hot-loader]/[source-map]/lib/read-wasm.js:8:13

  - wasm.js:25 wasm
    [react-static-prismic-v7]/[react-hot-loader]/[source-map]/lib/wasm.js:25:16

  - source-map-consumer.js:264 BasicSourceMapConsumer.then.that
    [react-static-prismic-v7]/[react-hot-loader]/[source-map]/lib/source-map-consumer.js:264:14

This seems to happen when I’m importing the following package:

import Prismic from "prismic-javascript";

When prismic-javascript is commented out, the local server starts as expected.

Directly including this package in the static.config.js does not produce this error on a clean React Static install, but when calling functions from other files that have this imported, the build does not work on 7.0.10 for some reason.

Everything works fine on production.

About this issue

  • Original URL
  • State: closed
  • Created 5 years ago
  • Reactions: 2
  • Comments: 16 (8 by maintainers)

Most upvoted comments

I was having the same issue and eventually, we found the following workaround as all seemed to point to source map generation being the culprit.

Create a node.api.js file in your root folder and add the following:

export default () => ({
  webpack: config => {
    config.devtool = process.env.NODE_ENV === 'production' ? false : 'eval'
    return config
  },
})

Eval source maps seem to be working fine, you could also just set it to false if you prefer, any other value seemed to fail in our case.

Working with react-static v7.0.10 and prismic-javascript v2.0.3

I did find a workaround to at least get us developing… Just set the node env to production at the top of static.config.js

process.env.NODE_ENV = 'production'
import Prismic from 'prismic-javascript'

Interesting. I’ll check into this and figure out what is going on. Clearly it has something to do with the new hot-loader changes.

My issue was a apollo-fetch call.

I tried changing to graphql-request, but have the same problem.

It might be related to this source-map issue about fetch as these libraries and prismic-javascript all use fetch.

This react-hot-loader issue also references the source-map issue.

Turning off sourcemaps doesn’t feel like a solution to me. I find sourcemaps to be hugely important during development and eval doesn’t generate meaningful maps… I came up with a workaround, but it feels hacky: First add these to your package.json:

"resolutions": {
    "react-hot-loader/source-map": "^0.8.0-beta.0"
  },

Then run yarn install

This will enable yarn to install the patched version of source-map in the react-hot-loader node_modules (installing source-map yourself won’t help.)

Not very elegant in our case since we use npm which clobbers the patched source-map on npm install