Set up wasm-bindgen for easy Rust/JavaScript Interoperability

Share this video with your friends

Interoperability between JavaScript and Rust is limited to numerics and accessing memory directly. Since this can be exhausting and overwhelming to do manually the Rust/Wasm team has created the wasm-bindgen project to facilitate high-level interactions between Rust and JavaScript.

Malachiain

~ 6 years ago

I think export const appendStringtoBody = (value) => { in the transcript should be export const appendStringToBody = (value) => {. I hope this helps someone else.

Giuseppe Cardella

~ 6 years ago

If you get a relative path error: error: relative module paths aren't supported yet 5 | #[wasm_bindgen(module="../domUtils")]

Put the domUtils.js inside of the /pkg and change the line in lib.rs from #[wasm_bindgen(module="../domUtils")] to #[wasm_bindgen(module="domUtils")] and rerun wasm-pack build

hkwid

~ 6 years ago

error: relative module paths aren't supported yet 5 | #[wasm_bindgen(module="../domUtils")]

To fix the error of relative path, you need to change [wasm_bindgen(module="../domUtils")] -> [wasm_bindgen(module="/domUtils")]. In this case / means root of the project.

When you move domUtils, you will face another error from webpack-dev-server.

[Reference] https://rustwasm.github.io/docs/wasm-bindgen/reference/js-snippets.html?highlight=relative,path#caveats

Nik Graf(instructor)

~ 6 years ago

Thanks Giuseppe & hkwid for the hints!

EdmundsEcho

~ 5 years ago

A recent fix to the "can't load relative module" is to set the attribute raw_module= "../domUtils"

Jeremy Swanborough

~ 5 years ago

raw module binding is the only thing that worked for me, thanks @EdmundsEcho