手动设置

⚠️ 这不是开始 wasm-pack 项目的推荐方法！如果您误入此页面，请查看我们的推荐项目启动方式。

步骤 1：创建一个新的 Rust 库项目

您可以使用以下命令创建一个名为 my-lib 的新 Rust 项目。

cargo new --lib my-lib

--lib 标志指定该项目是一个库，这很重要，因为我们将从 JavaScript 调用此代码。

步骤 2：编辑您的 `Cargo.toml` 文件

添加 `wasm-bindgen` 依赖项

您需要在 Cargo.toml 的依赖项部分添加 wasm-bindgen。wasm-bindgen 是一种工具，它可以促进 wasm 模块和 JavaScript 之间的互操作性。

⚠️ 如果您来自 JavaScript，您可能会注意到，当我们添加依赖项时，没有 ^ 或 ~ 符号 - 看起来我们锁定在 0.2 版本。但是，情况并非如此！在 Rust 中，^ 是隐含的。

添加 `crate-type`

接下来，添加一个 [lib] 部分，其中包含一个名为 crate-type 的新字段，将其设置为 "cdylib"。这指定库是一个与 C 兼容的动态库，这有助于 cargo 在针对 wasm32 时将正确的标志传递给 Rust 编译器。

完成这些更改后，您的 Cargo.toml 文件应如下所示

[package]
name = "hello-wasm"
version = "0.1.0"
authors = ["Ashley Williams <[email protected]>"]
description = "babby's first wasm package"
license = "MIT OR Apache-2.0"
repository = "https://github.com/ashleygwilliams/hello-wasm"

[lib]
crate-type = ["cdylib"]

[dependencies]
wasm-bindgen="0.2"

步骤 3：编写一些 Rust 代码！

现在您的 Cargo.toml 文件中已正确配置了您的 crate，设置项目的最后一步是在您的 src/lib.rs 文件中添加一些 Rust 代码。

浏览器示例

我们提供的模板为您提供了一个快速“Hello, World”项目，您可以将其用于编译成 WebAssembly 库，然后在浏览器中使用。

#![allow(unused)]
fn main() {
extern crate wasm_bindgen;

use wasm_bindgen::prelude::*;

#[wasm_bindgen]
extern {
    fn alert(s: &str);
}

#[wasm_bindgen]
pub fn greet() {
    alert("Hello, World!");
}
}

Hello wasm-pack!