Project Setup
專案設定
Rust
首先，你的電腦裡必須要安裝 Rust。請參考官網的教學安裝 Rust 與 cargo 這個套件管理工具。
Wasm 編譯工具
我們需要額外的工具來增加 WebAssembly 與 JavaScript 的互操作性。此外，根據你選擇的工具，他們可以產生當你的應用程式運行在瀏覽器時， .wasm 檔案所需要的 JavaScript 程式碼，減少佈署與打包的麻煩。
wasm-pack
一套 CLI 工具，由 Rust/Wasm Working Group 為了編譯並打包 WebAssembly 所開發的。最好與 Webpack 的 wasm-pack-plugin 搭配使用。
wasm-bindgen
同時是套件，也是 CLI 工具，並由 Rust / Wasm Working Group 開發。他是一套較底層的工具（通常是 wasm-pack 內部使用），用以增加 JavaScript 與 WebAssembly 的互操作性。我們不建議直接使用 wasm-bindgen，因為你需要多寫一些 JavaScript 的程式碼來引入你的 WebAssembly 二進位檔案。雖然如此，你仍然可以使用 wasm-bindgen，更多資訊請參考 wasm-bindgen guide。
cargo-web
在 wasm-pack 與 wasm-bindgen 出來之前，這是我們的首選工具。在安裝與執行方面，他的速度仍是最快的，我們推薦你安裝他去執行我們的那些還沒有使用 wasm-pack 的範例。
比較
wasm-pack
|
wasm-bindgen
|
cargo-web
|
|
|---|---|---|---|
| 專案狀態 | 持續由 Rust / Wasm Working Group 維護中 | 持續由 Rust / Wasm Working Group 維護中 | GitHub Repo 已經六個月以上沒有動靜了 |
| 開發體驗 | 還可以，需要搭配 Webpack | 太過底層，你需要寫一腳本來優化開發體驗 | 可以動！另外無需外部套件支援 |
| 本地端的伺服器 (Local Server) | 搭配 webpack 插件 |
不支援 | 支援 |
| 當檔案被更動，自動重編譯 | 搭配 webpack 插件 |
不支援 | 支援 |
| 無頭瀏覽器測試 | Supported | Supported | Supported |
| 支援的目標程式碼 |
|
|
|
web-sys
|
相容 | 相容 | 不相容 |
stdweb
|
相容 | 相容 | 相容 |
| 範例用法 | 新手模板 | Yew 範例的編譯腳本 | Yew 範例的編譯腳本 |