A rollup plugin that inlines (base64 encoded) and imports WebAssembly modules
Switch branches/tags
Clone or download
ballercat and ColinEberhardt fix: fixes incorrect encoding of large wasm modules
Due to the fact that rollup loads sources as utf-8 strings, this encoding may mangle binary information in some cases and is backed up by this issue rollup/rollup#1786
Unfortunately, as long as this is an issue, this plugin is not very useful for anything beyond a few lines of simple WebAssembly, so I took the liberty of patching in a loader function for this plugin as well as some tests to go along with it.
Latest commit d20a507 Oct 8, 2018

readme.md

rollup-plugin-wasm

semantic-release

Rollup plugin for importing WebAssembly modules.

Use this Rollup plugin to import WebAssembly modules and bundle them as base64 strings. They are imported async (but small modules can be imported sync).

Install

npm i -D rollup-plugin-wasm

Configuration

Add the plugin to your rollup config and then any imported .wasm file will be processed by it.

import wasm from 'rollup-plugin-wasm'

export default {
  input: 'web/index.js',
  plugins: [
    wasm()
  ]
}

Example

Given the following simple C file (compiled using emscripten, or the online WasmFiddle tool):

int main() {
  return 42;
}

Import and instantiate the resulting file:

import wasm from './sample.wasm';

sample({ ...imports }).then(({ instance }) => {
  console.log(instance.exports.main())
})

The WebAssembly is inlined as a base64 encoded string (which means it will be ~33% larger than the original). At runtime the string is decoded and a module is returned.

Sync Modules

Small modules (< 4KB) can be compiled synchronously by specifying them in the configuration.

wasm({
  sync: [
    'web/sample.wasm',
    'web/foobar.wasm'
  ]
})

This means that the exports can be accessed immediately.

import module from './sample.wasm'

const instance = sample({ ...imports })

console.log(instance.exports.main())