Magic Header not present

[KeweiCodes]

Hi there, I keep getting the following error with no idea why or what it is, any help guys?

ERROR

in ./app/src/wasm/factorial.wasm (./node_modules/arraybuffer-loader!./app/src/wasm/factorial.wasm)
Module parse failed: magic header not detected
You may need an appropriate loader to handle this file type.
Error: magic header not detected
at new CompileError (/Users/keweijiang/dev_play/electron-react-webpack/node_modules/webassemblyjs/lib/errors.js:40:109)
at parseModuleHeader (/Users/keweijiang/dev_play/electron-react-webpack/node_modules/@webassemblyjs/wasm-parser/lib/decoder.js:234:13)
at Object.decode (/Users/keweijiang/dev_play/electron-react-webpack/node_modules/@webassemblyjs/wasm-parser/lib/decoder.js:1413:3)
at decode (/Users/keweijiang/dev_play/electron-react-webpack/node_modules/@webassemblyjs/wasm-parser/lib/index.js:208:21)
at WebAssemblyParser.parse (/Users/keweijiang/dev_play/electron-react-webpack/node_modules/webpack/lib/wasm/WebAssemblyParser.js:44:15)
at doBuild.err (/Users/keweijiang/dev_play/electron-react-webpack/node_modules/webpack/lib/NormalModule.js:398:32)
at runLoaders (/Users/keweijiang/dev_play/electron-react-webpack/node_modules/webpack/lib/NormalModule.js:280:12)
at /Users/keweijiang/dev_play/electron-react-webpack/node_modules/loader-runner/lib/LoaderRunner.js:370:3
at iterateNormalLoaders (/Users/keweijiang/dev_play/electron-react-webpack/node_modules/loader-runner/lib/LoaderRunner.js:211:10)
at iterateNormalLoaders (/Users/keweijiang/dev_play/electron-react-webpack/node_modules/loader-runner/lib/LoaderRunner.js:218:10)
at /Users/keweijiang/dev_play/electron-react-webpack/node_modules/loader-runner/lib/LoaderRunner.js:233:3
at runSyncOrAsync (/Users/keweijiang/dev_play/electron-react-webpack/node_modules/loader-runner/lib/LoaderRunner.js:130:11)
at iterateNormalLoaders (/Users/keweijiang/dev_play/electron-react-webpack/node_modules/loader-runner/lib/LoaderRunner.js:229:2)
at Array. (/Users/keweijiang/dev_play/electron-react-webpack/node_modules/loader-runner/lib/LoaderRunner.js:202:4)
at Storage.finished (/Users/keweijiang/dev_play/electron-react-webpack/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:43:16)
at provider (/Users/keweijiang/dev_play/electron-react-webpack/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:79:9)
at /Users/keweijiang/dev_play/electron-react-webpack/node_modules/graceful-fs/graceful-fs.js:78:16
at FSReqWrap.readFileAfterClose [as oncomplete] (fs.js:503:3)
@ ./app/src/App.jsx 5:13-64
@ ./app/src/renderer_process.js

[xtuc]

Could you please share your wasm file?

[pine]

Could you please share your wasm file?

That's sounds good.

@KeweiCodes
I want to reproduce your issues. Could you share your information?

[xtuc]

My guess is that either ./app/src/wasm/factorial.wasm is not a wasm binary or that it wasn't imported correctly (arraybuffer-loader?).

[KeweiCodes]

In terms of the WASM file, I was using this example by wasm-loader.

The funny thing is that when I renamed the .wasm extension to something else, everything worked without error.

[KeweiCodes]

@pine sorry I'll don't have access to that atm, will get back to you soon!

[pine]

@KeweiCodes

I found the issue. webpack/webpack#7264 (comment)
How about using the following settings?

{
  test: /\.wasm$/,
  type: 'javascript/auto',
  loaders: ['arraybuffer-loader'],
}

[KeweiCodes]

@pine wow that worked! Thank you! But that's a very strange behaviour by Webpack.

[KeweiCodes]

@pine should this be mentioned in the docs here?

[pine]

@KeweiCodes I'll update README.md. Thank you!

[glebmachine]

@pine!

How do i provide type in inline mode?
Like: !!arraybuffer-loader?type=javascript/auto./zxing.wasm

I'm using angular-cli, which controls webpack config under the hood. So, will be great to provide type without changing webpack config. Is it possible?

[NothingEverHappens]

As a workaround, changing file extension to anything else solved the issue for me.

• Fetch & maybe copy, the ideal solution: Webpack Usage? microsoft/vscode-oniguruma#10 (comment)
• Inline it for 1-file bundle and use a non-streaming compiler: How to load onigasm.wasm via webpack zikaari/onigasm#2 (comment)