环境
- Time 2022-05-12
- Rust 1.60.0
- Node 12.22.5
- wasm-pack 0.10.2
前言
说明
环境配置参考:https://rustwasm.github.io/docs/book/game-of-life/setup.html
参考:https://rustwasm.github.io/docs/book/game-of-life/hello-world.html
目标
实现第一个 wasm 程序,使用 wasm 弹出一个 alert 框。
Cargo.toml
[package]
edition = "2021"
name = "game"
version = "0.1.0"
[lib]
crate-type = ["cdylib", "rlib"]
[features]
default = ["console_error_panic_hook"]
[dependencies]
console_error_panic_hook = {version = "*", optional = true}
wasm-bindgen = "*"
wee_alloc = {version = "*", optional = true}
[dev-dependencies]
wasm-bindgen-test = "*"
[profile.release]
opt-level = "s"
lib.rs
mod utils;
use wasm_bindgen::prelude::*;
#[cfg(feature = "wee_alloc")]
#[global_allocator]
static ALLOC: wee_alloc::WeeAlloc = wee_alloc::WeeAlloc::INIT;
#[wasm_bindgen]
extern "C" {
fn alert(s: &str);
}
#[wasm_bindgen]
pub fn greet() {
alert("hello wasm");
}
utils.rs
pub fn set_panic_hook() {
#[cfg(feature = "console_error_panic_hook")]
console_error_panic_hook::set_once();
}
增加构建目标
rustup target add wasm32-unknown-unknown
wasm-pack
wasm-pack build
[INFO]: Checking for the Wasm target...
[INFO]: Compiling to Wasm...
warning: function is never used: `set_panic_hook`
--> src\utils.rs:1:8
|
1 | pub fn set_panic_hook() {
| ^^^^^^^^^^^^^^
|
= note: `#[warn(dead_code)]` on by default
warning: `game` (lib) generated 1 warning
Finished release [optimized] target(s) in 0.07s
[WARN]: :-) origin crate has no README
[INFO]: Installing wasm-bindgen...
[INFO]: Optimizing wasm binaries with `wasm-opt`...
[INFO]: Optional fields missing from Cargo.toml: 'description', 'repository', and 'license'. These are not necessary, but recommended
[INFO]: :-) Done in 9.67s
[INFO]: :-) Your wasm pkg is ready to publish at C:\Users\jiangbo\work\game\pkg.
生成前端
npm init wasm-app www
增加依赖
"dependencies": {
"game": "file:../pkg"
}
启动
npm run start
总结
实现了第一个 wasm 程序,在浏览器中弹出了一个 alert 框。