JS 代码片段
通常,在开发要在 Web 上运行的 crate 时,您会希望时不时地包含一些 JS 代码。虽然 js-sys
和 web-sys
涵盖了许多需求,但它们并没有涵盖所有内容,因此 wasm-bindgen
支持在 Rust 代码旁边编写 JS 代码,并将其包含在最终输出工件中的功能。
要包含本地 JS 文件,您将使用 #[wasm_bindgen(module)]
宏
# #![allow(unused_variables)] #fn main() { #[wasm_bindgen(module = "/js/foo.js")] extern "C" { fn add(a: u32, b: u32) -> u32; } #}
此声明表示 extern
块中包含的所有函数都从 /js/foo.js
文件导入,其中根目录相对于 crate 根目录(Cargo.toml
所在的位置)。
当 wasm-bindgen
执行时,/js/foo.js
文件将进入最终输出,因此您可以在库中使用 module
注解,而无需担心库的用户!
JS 文件本身必须使用 ES 模块语法编写
export function add(a, b) {
return a + b;
}
如果您有兴趣,可以在 RFC 6 中找到此功能的完整设计!
使用 inline_js
除了 module = "..."
之外,如果您是宏作者,您还可以使用 inline_js
属性
# #![allow(unused_variables)] #fn main() { #[wasm_bindgen(inline_js = "export function add(a, b) { return a + b; }")] extern "C" { fn add(a: u32, b: u32) -> u32; } #}
使用 inline_js
表示 JS 模块在属性本身中内联指定,并且不从文件系统加载任何文件。它们与使用 module
时具有相同的限制和注意事项,但有时对于宏本身来说更容易生成。不建议手写代码使用 inline_js
,而应尽可能利用 module
。
注意事项
虽然非常有用,但本地 JS 代码片段目前存在一些需要注意的注意事项。其中许多都是临时的!
-
目前,JS 文件中不支持
import
语句。这是一个限制,我们将来可能会在确定支持此功能的良好方式后取消此限制。但是,目前,js 代码片段必须是独立的模块,并且不能从任何其他内容导入。 -
仅支持
--target web
和默认的打包器输出模式。要支持--target nodejs
,我们需要将 ES 模块语法转换为 CommonJS(计划这样做,只是尚未完成)。此外,要支持--target no-modules
,我们必须类似地将 ES 模块转换为其他内容。 -
module = "..."
中的路径当前必须以/
开头,或者以 crate 根目录为根。计划最终支持诸如./
和../
之类的相对路径,但目前认为这需要在 Rustproc_macro
crate 中获得更多支持。
如上所述,有关注意事项的更多详细信息可以在 RFC 6 中找到。