This is a simple Webpack loader that shells out to cargo to build a Rust project targeting WebAssembly. See this post for more details on using Rust to target the web.
To use it, first install the package:
$ npm install rust-wasm-loader
Configure the loader in your Webpack config:
module.exports = {
// ...
module: {
rules: [
{
test: /\.rs$/,
use: {
loader: 'rust-wasm-loader',
options: {
// Path to your 'build' or 'dist' directory relative to project root
path: 'build/',
}
}
},
// ...
]
}
}
Make sure you have the cargo
, rustc
, and emsdk
binaries somewhere in your PATH
.
Require and initialize the wasm module:
const wasm = require('./main.rs')
wasm.initialize().then(module => {
// Use your module here
const doub = module.cwrap('doub', 'number', ['number'])
console.log(doub(21))
})
or with async/await:
async function loadAndUseWasm() {
const wasm = require('./main.rs')
const module = await wasm.initialize()
const doub = module.cwrap('doub', 'number', ['number'])
console.log(doub(21))
}
loadAndUseWasm()
The following options can be added to the Webpack loader query:
Name | Description | Required | Default |
---|---|---|---|
release |
Whether or not to pass the --release flag to cargo |
false | false |
path |
Path to your webpack output folder relative to project root | true | '' |
Check out the example directory for a simple Hello World example.
This project is based off of rust-emscripten-loader by mrdziuban.