Pre loader

Error: wasm streaming compile failed: TypeError: Failed to execute 'compile' on 'WebAssembly'

Welcome to the SciChart Forums!

  • Please read our Question Asking Guidelines for how to format a good question
  • Some reputation is required to post answers. Get up-voted to avoid the spam filter!
  • We welcome community answers and upvotes. Every Q&A improves SciChart for everyone

WPF Forums | JavaScript Forums | Android Forums | iOS Forums

Answered
1
0

Hello, I just started evaluating your 2D JS chart library and am running into an error (below) and don’t know what I should do to continue forward:

Error:

wasm streaming compile failed: TypeError: Failed to execute ‘compile’
on ‘WebAssembly’: Incorrect response MIME type. Expected
‘application/wasm’.

falling back to ArrayBuffer instantiation

failed to asynchronously prepare wasm: CompileError: WebAssembly.instantiate(): expected magic word 00 61 73 6d, found 3c 21 44 4f @+0

CompileError: WebAssembly.instantiate(): expected magic word 00 61 73 6d, found 3c 21 44 4f @+0

Could not load SciChart WebAssembly module.
Check your build process and ensure that your scichart2d.wasm, scichart2d.data and scichart2d.js files are from the same version

Uncaught (in promise) Could not load SciChart WebAssembly module.
Check your build process and ensure that your scichart2d.wasm, scichart2d.data and scichart2d.js files are from the same version


I am copying the scichart2d.data and scichart2d.wasm in my webpack config as follows (according to your tutorials):

config.plugins.push(
    new CopyPlugin({
        patterns: [
            // {
            //     from: 'src/index.html',
            //     to: '',
            // },
            {
                from: 'node_modules/scichart/_wasm/scichart2d.data',
                to: '',
            },
            {
                from: 'node_modules/scichart/_wasm/scichart2d.wasm',
                to: '',
            },
        ],
    })

I have since then done the following but to no avail:

  1. Restart my webpack-dev-server -> In chrome, “Empty cache and refresh”
  2. Delete my node_modules folder -> yarn install -> yarn start

Can someone please help me with this issue at an earliest convenience.

Version
2.1.2290
  • You must to post comments
Best Answer
0
1

Solved. For anyone running into this issue, please follow the guideline below to resolve it.

This only applies if you created your app from CRA. I used SciChart’s “demo-create-react-app-scichart” to solve my issue.

After you have scaffolded your app from CRA, add “copy-files-from-to” as your dev dependency:

npm install --save-dev copy-files-from-to

Then create a file called “copy-files-from-to.json” in the root of your project. The contents of the file should be:

    {
  "copyFilesSettings": {
    "whenFileExists": "overwrite"
  },
  "copyFiles": [
    {
      "from": "./node_modules/scichart/_wasm/scichart2d.data",
      "to": "./public/scichart2d.data"
    },
    {
      "from": "./node_modules/scichart/_wasm/scichart2d.wasm",
      "to": "./public/static/js/scichart2d.wasm"
    }
  ]
}

Then modify the start and build scripts in your package.json as follows:

"scripts": {
    "copyWasm": "copy-files-from-to --config copy-files-from-to.json",
    "start": "npm run copyWasm && react-scripts start",
    "build": "npm run copyWasm && react-scripts build"
},

Now when you run your app using “npm run start”, you should not have the issue. Please note that, for some reason, the initial build takes longer with these steps, but if you change something in the code, the hot-reload just works fine and fast.

That’s all folks!

  • You must to post comments
1
0

Hi Sachin,

I can see in the output this error:

Uncaught (in promise) Could not load SciChart WebAssembly module.
Check your build process and ensure that your scichart2d.wasm, scichart2d.data and scichart2d.js files are from the same version

Do you have a mismatch in version(s) of SciChart.js here? How have you installed and setup the project?

Please try out one of our boilerplates or getting started guides, and are you seeing the same error?

If you’re still stuck, can you share with us a small GitHub repo or project in a dropbox which reproduces the issue. Our team will be happy to help.

Best regards
Andrew

  • You must to post comments
0
0

Yes, I am still stuck. I have attached a zip file containing my project. Its a simple project – real simple.

I created this project using:

npx create-react-app sci-chart-test --template typescript

npm install scichartjs

npm install --save-dev copy-webpack-plugin react-app-rewired

I needed the copy-webpack-plugin and react-app-rewired to copy .data and .wasm file according to your instructions. Since I created my project using CRA and I did not want to EJECT out of it to change the webpack.config.js, I had to go this route.

In the root of the project, you will find config-overrides.js. This modifies the webpack config by adding the step to copy the two files.

Then I had to change the package.json to use react-app-rewired for start and build script.

Steps to replicate my issue:
1. Download the attached zip file and extract the contents to a folder called “sci-chart-test”
2. CD into that folder
3. npm install
4. npm start
5. Once the app shows up in the browser, open DevTools and you will see the errors in the console.

I am using the “trial” – so please try to use a “trial” version as well.

So far, I have tried in two different browsers — Chrome and Edge — getting errors in both:

Environment:
Windows 10, Version: 21H2, OS Build: 19044.1469
Node: v14.17.6
Npm: v7.14.0
Chrome: Version 99.0.4844.74 (Official Build) (64-bit)
Edge: Version 99.0.1150.39 (Official build) beta (64-bit)

Hope that helps.

Attachments
  • You must to post comments
Showing 3 results
Your Answer

Please first to submit.

Try SciChart Today

Start a trial and discover why we are the choice
of demanding developers worldwide

Start TrialCase Studies