Usage with React Native / Expo

[kitce]

What is the issue about?

• Bug
• Feature request
• Usage question
• Documentation
• Contributing / Development

What part(s) of Essentia.js is involved?

• essentia.js-core (vanilla algorithms)
• essentia.js-model (machine learning algorithms)
• essentia.js-plot (plotting utility module)
• essentia.js-extractor (typical algorithm combinations utility)
• essentia-wasm

Description

Thank you creating this library, it looks interesting. I am planning to develop a mobile app to integrate Essentia.js in React Native / Expo. Although it supports modern browsers, it seems to not work with React Native.

It will be great to have an example or documentation on integrating Essential.js into React Native / Expo.

Steps to reproduce / Code snippets / Screenshots

What I have tried:

// index.tsx
import Essentia from 'essentia.js/dist/essentia.js-core.es.js';
import EssentiaWASM from 'essentia.js/dist/essentia-wasm.web.js';

const EssentiaWasm = await EssentiaWASM();
                           ^^^ ReferenceError: Property 'document' doesn't exist

The essentia-wasm.web.js may assume this is a browser environment, therefore some code failed on React Native environment.

Then I tried to import the .wasm file and pass it into the Essentia constructor directly, but Expo cannot import the raw binary file data, instead it returns the ID(?) of the imported module, I guess that's why the Essentia class fails to initiate an instance.

// metro.config.js
config.resolver.assetExts.push('wasm');

// index.tsx
import Essentia from 'essentia.js/dist/essentia.js-core.es.js';
import EssentiaWasm from 'essentia.js/dist/essentia-wasm.web.wasm'; // `EssentiaWasm` is just a number here

const essentia = new Essentia(EssentiaWasm);
                     ^^^ TypeError: Cannot read property 'prototype' of undefined

System info

Expo: 51.0.9
React Native: 0.74.1
Device: iOS Simulator iPhone 15 Pro iOS 17.2
Essentia.js: 0.1.3