You must provide the URL of lib/mappings.wasm by calling SourceMapConsumer.initialize({ 'lib/mappings.wasm': ... }) before using SourceMapConsumer

Question

I'm facing this error when building a project (Angular 8). How can we fix this error?

Error:

You must provide the URL of lib/mappings.wasm by calling SourceMapConsumer.initialize({ 'lib/mappings.wasm': ... }) before using SourceMapConsumer

Granicus

Whoever runs into any similarly worded error should fix the actual issues rather than use the hacks below. In my case i ran an npm update. – Wits

Answer 1

$env:NODE_OPTIONS = "--no-experimental-fetch"

Run this command in Visual Studio Code in power shell, this will fix the problem ISA.

Granicus

FYI this is in power shell – Bryannabryansk

Answer 2

I get the same problem when building a ts-project.

The problem

For me the cause was the source-map package release 0.7.3 This version of the source-map package detects the environment by looking for the "fetch" function. Since the fetch function is available in Node.js version 18, sourcemap thinks it is running in a browser (and throws the error)

This is fixed in source-map version 0.7.4.

The work-around

[edited 2024 April 8th]
The solutions proposed by nuander and Mohammed Osman will probably work to some extend, depending on your project.

Since I am working on a big project where I do not know the impact of an npm update, I implemented this work-around:

Add an overrides field to your package.json:

"overrides":{
   "foo":{
     "source-map": "0.7.4"
   }
 }

Where foo is the package dependent on the fault source-map package.

This solved it for me.

NB: the resolutions field is only supported in npm version 8.3.0 or higher. If you are using an earlier version of npm, the overrides field will be ignored.

The solution

[edited 2024 April 8th]

As stated by J Gallardo in the comments: It is better to fix the problem, which can differ from project to project. But due to dependencies on (legacy) packages this can be a very time-consuming. We are updating the full project step-by step to the latest Node/NPM in order to fix it.

Fluky

This is the less hacky solution, indeed, but as stated by JGallardo in his comment on the question it is not ideal... – Skit

I totally agree, but not all of us have the luxury to run npm update – Fluky

This didn't work for me. I read into the issue on github and some people seemed to say that upgrading their version of source-map had resolved the issue. It didn't work for me either... – Disassemble

I am using source-map v0.7.4 and it still produces this error. – Photothermic

Answer 3

 npm install source-map 

updating source-map solved the problem for me on apple m1 Mac

Cercus

Solved this issue on M3 MacBook – Velutinous

Same. M1 MacBook Pro with macOS15 – Cholecystotomy

Answer 4

My internet research lead to indications that this is an issue in newer versions of node. Setting NODE_OPTIONS as suggested did not help. Downgrading to an earlier version fixed this for me.

Bryannabryansk

What version did you downgrade to? – Wits

I ran into a similar issue trying out source-map-unpack and succeeded when I switched to 17.9.1. That's enough major versions back it will be less viable of an option in the future but for running a tool by itself it was fine for me. – Divert

Answer 5

-Node version: 16.20.2

-package.json "start": "craco --openssl-legacy-provider start ", "build": "craco build",

I have used Node version 18, then, this error happens. So, I have installed NVM and I have installed Node 16.20.2. Successfully build the project.

Thanks a lot

Ketchum

Answer 6

export NODE_OPTIONS="--openssl-legacy-provider --no-experimental-fetch"

Latoyalatoye