Error encountered when packaging WebAssembly using Rollup

When I use wasm-pack to compile some rust code into webassembly, specifically with the option --target browser (which is the default), these are the files that I see in typescript/deps/ed25519xp:

  • ed25519xp_bg.wasm
  • ed25519xp_bg.d.ts
  • ed25519xp.d.ts
  • ed25519xp.js
  • package.json

This is how my typescript file looks:

// typescript/src/index.ts

export { seed_from_phrase, gen_keypair } from "ed25519xp";

The contents of my package.json are as follows:

{
  "name": "ed25519",
  "version": "0.1.0",
  "description": "ed25519",
  "main": "typescript/dist/bundle.js",
  "types": "typescript/src/index.ts",
  "dependencies": {
    "ed25519xp": "file:typescript/deps/ed25519xp"
  },
  "devDependencies": {
    "@types/node": "^13.7.1",
    "typescript": "^3.7.5",
    "@rollup/plugin-commonjs": "^11.0.2",
    "@rollup/plugin-multi-entry": "^3.0.0",
    "@rollup/plugin-node-resolve": "^7.1.1",
    "@rollup/plugin-wasm": "^3.0.0",
    "rollup": "^1.31.1",
    "rollup-plugin-typescript2": "^0.26.0"
  }
}

And this is my rollup configuration:

// rollup.config.js
import resolve from "@rollup/plugin-node-resolve";
import commonjs from "@rollup/plugin-commonjs";
import typescript from "rollup-plugin-typescript2";
import multi from "@rollup/plugin-multi-entry";
import wasm from "@rollup/plugin-wasm";

export default {
  input: [
    "typescript/deps/ed25519xp/ed25519xp_bg.wasm",
    `typescript/src/index.ts`
  ],
  output: {
    sourcemap: true,
    format: "iife",
    name: "ed25519",
    file: `typescript/dist/bundle.js`
  },
  plugins: [
    multi(),
    resolve({
      browser: true,
      extensions: [".js", ".ts", ".wasm"]
    }),
    commonjs({
      include: [
        `typescript/**/*.js`,
        `typescript/**/*.ts`,
        `typescript/**/*.wasm`,
        "node_modules/**"
      ]
    }),
    typescript(),
    wasm()

    // If we're building for prod (npm run build
    // instead of npm run dev), minify
    // terser()
  ]
};

After running the bundle command with rollup (node node_modules/.bin/rollup -c), I encounter this error message:

(!) Missing exports
https://rollupjs.org/guide/en/#error-name-is-not-exported-by-module
typescript/deps/ed25519xp/ed25519xp.js
memory is not exported by typescript/deps/ed25519xp/ed25519xp_bg.wasm
...

However, when examining the .wasm file as WAT, it seems that the exports are present:

...
  (func $seed_from_phrase (export "seed_from_phrase") (type $t6) (param $p0 i32) (param $p1 i32) (result i32)
...
  (func $gen_keypair (export "gen_keypair") (type $t6) (param $p0 i32) (param $p1 i32) (result i32)
...

You can find the entire repository at https://github.com/nmrshll/ed25519/tree/943fc841693401acc64260fc19d4dda08ae3503d.

How can I resolve the "Missing exports" issue during bundling?

Answer №1

You should use --target web when calling wasm-pack instead.

For more information, refer to the documentation here:

This approach resolved similar errors for me in my setup, although I was utilizing wasm-bindgen rather than wasm-pack.

Answer №2

Although it may be a bit belated, I encountered a similar issue when working with rollup and an already compiled wasm-pack node module. Specifically, the challenge arose when I needed to use the same wasm file in both my main svelte page and a service worker.

To address this, I hastily developed a rollup plugin (proof of concept) that facilitates the utilization of a wasm-pack node module and automatically transfers the necessary wasm file to the output directory.

Just like mentioned in the previous response, it is crucial for the wasm-pack module to be constructed with the "--target web" flag.

If you prefer compiling your Rust code directly, I suggest leveraging the rust plugin for rollup.

You can access the rollup-wasm-pack-import package here.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Tips for integrating yarn add/npm install with monorepositories

I am attempting to retrieve a node package from a private monorepo on GitHub, structured similarly to this: monorepoProject --- subProjectA --- subProjectB Both subProjectA and subProjectB are TypeScript projects, following the layout depicted below: ...

Managing unpredictable fields within a TypeScript interface Let me known if you need further assistance

Currently, I am developing a web application using Angular and encountered an issue with the JSON data returned by a service call. The problem arises when the mapped JSON contains an Object within one of the fields with unpredictable content. How can I han ...

What is the purpose of having a constructor in Typescript when an interface is already used for a class?

Is it necessary to have a constructor in my class if the class already implements an interface? It seems like redundant code to me. interface PersonInterface { firstname: string; lastname: string; email: string; } class Person implements Pe ...

Turn off or delete certain features within an npm package

Is it possible to disable or remove unused functions in a npm library? I only need certain functions from the library and don't want others to be accessible. I want to retain the read function while disabling the write function to prevent developers ...

What is the best method to display a service property within a controller?

If we consider the scenario where I have a controller named ctrlA with a dependency called serviceB, which in turn has a property known as propertyC. My development environment involves Angular and Typescript. When interacting with the user interface, the ...

I am unable to utilize npm any longer

While troubleshooting a development error in my application, I encountered issues when switching my 'node' version back to 20.10.0. After attempting to use npm commands like "npm install" without success, I tried uninstalling and reinstalling nod ...

Angular 2 approach to retrieving items from an Observable<Xyz[]>

After reviewing the Typescript code in an Angular 2 service: getLanguages () { return this.http.get(this._languagesUrl) .map(res => <Language[]> res.json().data) .catch(this.handleError); I'm encountering a challenge whe ...

The optional dependency /chokidar/fsevents did not meet the requirements

Trying to install the "cordova-plugin-geolocation" package via npm, but encountering issues with its installation. Some warnings are popping up: npm WARN optional Skipping failed optional dependency /chokidar/fsevents: npm WARN notsup Not compatible with ...

Despite having both http-server and angular-http-server installed, the error message "bash: http-server: command not found" appears

https://i.stack.imgur.com/zuO2C.pngI have attempted various methods on StackOverflow, but I am still receiving the error message bash: http-server: command not found When I run the command npm list -g http-server, it returns: pi@raspberrypi:/usr/local/lib ...

Preserving the most recent choice made in a dropdown menu

Just started with angular and facing an issue saving the select option tag - the language is saved successfully, but the select option always displays English by default even if I select Arabic. The page refreshes and goes back to English. Any assistance o ...

Unable to upgrade nodejs (version 10.24.1) and npm (6.) to the most recent versions on Raspberry Pi 4

When setting up nodejs on my Raspberry PI 4, I followed these steps in the terminal: >> nodejs --version >> 10.24.1 >> sudo apt remove nodejs >> reboot >> sudo apt install nodejs >> nodejs --version >> 10.24.1 Sim ...

The property 'deploys' is not readable because it is undefined

I've encountered an issue when deploying my Angular application with Firebase Cloud Functions to Firebase. Despite receiving the "deploy complete" message, I am still facing an error that I cannot seem to troubleshoot. Any assistance would be greatly ...

Need help in NestJS with returning a buffer to a streamable file? I encountered an error stating that a string is not assignable to a buffer parameter. Can anyone provide guidance on resolving this issue?

The issue description: I am having trouble returning a StreamableFile from a buffer. I have attempted to use buffer.from, but it does not seem to work, resulting in the error message below. Concern in French language: Aucune surcharge ne correspond à cet ...

The error message encountered is when npm or git refuses to operate due to a missing host field in the credentials

I am encountering an issue while trying to install a dependency from git using the following command: npm i git://hostname.com/scm/projects/project.name.git#tag123 Unfortunately, I am getting the following error: npm ERR! Error while executing: npm ERR! ...

having trouble locating my personalized node in node-red

I recently started using node-red and have developed my own custom node which I published on the "npm registry". Although I can successfully install it using the npm command, I am unable to locate it within the "Node-red" platform. Can anyone provide gui ...

The input argument must be of type 'PollModel', as the property 'pollId' is required and missing in the provided 'any[]' type

Hey there! An issue popped up when I tried to pass an empty array as a model in my Angular project. The error message reads: "Argument of type 'any[]' is not assignable to parameter of type 'PollModel'. Property 'pollId' is ...

explore and view all images within a directory

Hello, I am new to NextJS and encountering some issues. I have a folder in my public directory containing 30 images that I want to import all at once in the simplest way possible, without having to import each image individually by name. Here is the curren ...

Issues with the speed of the 'npm install' command have been notably slow when executed on Windows

I've noticed that the npm install process is moving at a snail's pace for me. I'm currently running Windows 8.1 with the most up-to-date npm version, and my internet speed clocks in at around 100Mbit/s. The project I'm working on requi ...

Warning: React Admin may have unmet peer dependencies

Is there a way to eliminate the warnings about unmet peer dependencies when running yarn install? I'm having trouble resolving issues with packages like ra-data-graphql-simple, react-admin, and ra-input-rich-text. The errors are shown below: [3/4] Lin ...

Struggling to Launch ElectronNET/Electron.NET Application Due to Window Opening Issue

My attempt to launch the [ElectronNET-API-Demo application] from ElectronNET's official Github repository (https://github.com/ElectronNET/electron.net-api-demos) has hit a snag. Although electronize start seems to execute successfully and displays a ...