[SOLVED] How load an emscripten generated module with es6 import?

How load an emscripten generated module with es6 import?

I am trying to import a module generated with emscripten as a es6 module. I am trying with the basic example from emscripten doc.

This is the command I am using to generate the js module from the C module:

emcc example.cpp -o example.js -s EXPORTED_FUNCTIONS="['_int_sqrt']" -s EXTRA_EXPORTED_RUNTIME_METHODS="['ccall', 'cwrap']" -s EXPORT_ES6=1 -s MODULARIZE=1

The C module :

#include <math.h>

extern "C" {

  int int_sqrt(int x) {
    return sqrt(x);
  }
}

Then importing the generated js module:

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>Wasm example</title>
  </head>
  <body>
    <script type="module">
      import Module from './example.js'

      int_sqrt = Module.cwrap('int_sqrt', 'number', ['number']);
      console.log(int_sqrt(64));
    </script>
  </body>
</html>

This is failing because cwrap is not available on the Module object:

Uncaught TypeError: Module.cwrap is not a function

Solution

As you're using MODULARIZE, you have to make an instance of the Module first.

import Module from './example.js'
const mymod = Module();
const int_sqrt = mymod.cwrap('int_sqrt', 'number', ['number']);
console.log(int_sqrt(64));

You could also try the MODULARIZE_INSTANCE option.

You may need to wait for it to finish initialising - I'm not sure when the function is so simple. That would look like this:

import Module from './example.js'
const mymod = await Module();
const int_sqrt = mymod.cwrap('int_sqrt', 'number', ['number']);
console.log(int_sqrt(64));