Как использовать скомпилированный Emscripten JavaScript в React / React Native

Question

В настоящее время я использую Emscripten для компиляции базовой функции C в JavaScript для использования в проекте React Native. Однако когда я импортирую Module из кода React, объект Module становится пустым. Это происходит в проектах React и React Native.

Запуск index.js в моем терминале с node ./index.js возвращает ожидаемый результат.

Я компилирую ping.c и выводю ping.js с помощью этой команды:

emcc ping.c -o ping.js -s WASM=0 -s EXPORTED_FUNCTIONS='["_pingIt"]'

ping.c:

#include <stdio.h>
#include <emscripten.h>

EMSCRIPTEN_KEEPALIVE
int pingIt() {
  return 1;
}

index.js:

let Module = require('./ping.js');

module.exports = Module;

Я экспортирую Модуль из index.js и импортирую его в свой код React.

Текущее поведение

// Running in React
console.log(Module); // returns {}

Ожидаемое поведение

// Running in React
console.log(Module._pingIt()); // should return 1

Answer 1

Я наткнулся на настройку MODULARIZE в документах Emscripten здесь . Я отредактировал команду emcc:

emcc ping.c -o ping.js -s WASM=0 -s ENVIRONMENT=web -s EXTRA_EXPORTED_RUNTIME_METHODS='["cwrap"]' -s MODULARIZE=1

MODULARIZE=1 магический бит

Теперь в файле index.js:

let Module = require('./ping.js'); // Your Emscripten JS output file
let pingIt = Module().cwrap('pingIt'); // Call Module as a function

module.exports = pingIt;

Теперь в компоненте React вы можете import pingIt from '<file-location>'; и вызывать функцию, как и любой другой pingIt().

Надеюсь, кто-нибудь найдет это полезным! Я не смог найти много примеров использования Emscripten вместе с React.