webassembly-loader

Webpack loader for WebAssembly (like wasm-loader but have different export options)

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
webassembly-loader
1.1.05 years ago5 years agoMinified + gzip package size for webassembly-loader in KB

Popular Searches

Readme


!npmnpmnpm-url !sizesizesize-url !npmnpm-downloadnpm-url !depsdepsdeps-url !teststeststests-url
webassembly-loader
this loader can also be used as a library ā†™ see who use this?

tl;dr -- see examples

Motivation

future plans

Minimum Requirements

  • Node v8
  • Webpack v4

Installation

npm install webassembly-loader --save-dev
or 
yarn add webassembly-loader --dev

Options

export

How wasm code would be exported. (see examples)
  • Type: string
  • Default: async
  • Expected value:
- buffer will export wasm code as Buffer - module will export wasm code as WebAssembly.Module - instance will export wasm code as WebAssembly.Instance - async will instantiatewebassembly.instantiate wasm code asynchronously, return promise of both WebAssembly.Module and WebAssembly.Instance - async-module will compilewebassembly.compile wasm code asynchronously, return promise of WebAssembly.Module - async-instance will instantiatewebassembly.instantiate wasm code asynchronously, return promise of WebAssembly.Instance
webpack.config.js
module.exports = {
    rules: [{
          test: /\.wasm$/,
          type: "javascript/auto",
          use: [{
              loader: "webassembly-loader",
              options: {
                  export: "async"
              }
          }]
    }]
}

tips: you can use query parameterinline to change export mode on demand

Examples

See the test cases and example projects in .test.ts and examples for more insight.

{export: 'buffer'}

import wasmCode from "./lib.wasm";

WebAssembly.compile(wasmCode).then(module => {
  const instance = new WebAssembly.Instance(module);
  console(instance.exports.add(1, 2)); // 3
});

{export: 'module'}

import wasmModule from "./lib.wasm";

const instance = new WebAssembly.Instance(wasmModule);
console(instance.exports.add(1, 2)); // 3

{export: 'instance'}

import wasm from "./lib.wasm";

console(wasm.exports.add(1, 2)); // 3

{export: 'async'}

import wasmInstantiate from "./lib.wasm";

wasmInstantiate(importObject | undefined).then(({ instance, module }) => {
  console(instance.exports.add(1, 2)); // 3

  // create different instance, extra will be called in different environment
  const differentInstance = new WebAssembly.Instance(module);
  console(differentInstance.exports.add(1, 2)); // 6
});

{export: 'async-instance'}

import wasmInstantiate from "./lib.wasm";

wasmInstantiate(importObject | undefined).then(instance => {
  console(instance.exports.add(1, 2)); // 3
});

{export: 'async-module'}

import wasmInstantiate from "./lib.wasm";

wasmCompile(importObject | undefined).then(module => {
  const differentInstance = new WebAssembly.Instance(module);
  console(differentInstance.exports.add(1, 2)); // 3
});

Who use this?

Contributing

Credits

License

MIT