src: https://rustwasm.github.io/docs/book/game-of-life/setup.html
Install Rust toolchain:
- curl --proto '=https' --tlsv1.2 -sSf https://sh.rustup.rs | sh
- source $HOME/.cargo/env
- test if installed correctly: rustc --version
Install wasm-pack for Rust generated WebAssembly:
- https://rustwasm.github.io/wasm-pack/installer/
- curl https://rustwasm.github.io/wasm-pack/installer/init.sh -sSf | sh
Install cargo-generate to generate a new Rust project:
- cargo install cargo-generate
- this takes like 10 minutes
Switch to latest Node:
- nvm use 15
Generate a project from a repo:
- cargo generate --git https://github.com/rustwasm/wasm-pack-template
- name: nidoran
- remove or update email address in generated Cargo.toml
- cd nidoran/nidoran
- nvm use 15
- npm init wasm-app www
- in www: npm i
Add Crates/dependencies:
- when adding a crate with e.g.
extern crate web_sys;
- On crates.io find the crate: https://crates.io/crates/web-sys
- This lists the instruction: Add the following line to your Cargo.toml file:
web-sys = "0.3.50"
- in nidoran/nidoran, run,
cargo check
- Rebuild with
wasm-pack build
Build:
- in nidoran/nidoran/www:
wasm-pack build
(can also be run in nidoran/nidoran, but in www is easier to switch between this and npm start) - in nidoran/nidoran/www:
npm start
- TypeScript instead of JS!
- DONE: Remove name/email from generated pkg/package.json (comes from Cargo.toml)
=====================
A template for kick starting a Rust and WebAssembly project using wasm-pack.
Built with ๐ฆ๐ธ by The Rust and WebAssembly Working Group
๐ Read this template tutorial! ๐
This template is designed for compiling Rust libraries into WebAssembly and publishing the resulting package to NPM.
Be sure to check out other wasm-pack
tutorials online for other
templates and usages of wasm-pack
.
Learn more about cargo generate
here.
cargo generate --git https://github.com/rustwasm/wasm-pack-template.git --name my-project
cd my-project
wasm-pack build
wasm-pack test --headless --firefox
wasm-pack publish
wasm-bindgen
for communicating between WebAssembly and JavaScript.console_error_panic_hook
for logging panic messages to the developer console.wee_alloc
, an allocator optimized for small code size.