webassembly-loader

webassembly-loader

this loader can also be used as a library ^{↙ see who use this?}

^{tl;dr -- see examples}

Motivation

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 instantiate wasm code asynchronously, return promise of both WebAssembly.Module and WebAssembly.Instance
  • async-module will compile wasm code asynchronously, return promise of WebAssembly.Module
  • async-instance will 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 parameter 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?

• rs-jest
• rollup-plugin-rust
• [add yours 😉]

Contributing

• CONTRIBUTING.md for how you can make contribution
• HACKING.md for technical details

Credits

• rust-native-wasm-loader
• webpack-defaults

---

License

MIT