如何将WebAssembly包含在打字稿中没有Node.js

问题描述

我想知道是否有任何一种方式可以尽可能简单地将带有typescript的webassembly包括在内,我不使用node。 如果我激活了allowJs: true中的选项tsconfig.json,并且我手动移动了wasm文件,那么它将起作用。 这种解决方案似乎不太干净,因为我有两个非常相似的“胶水”文件(network_calculator_lib.js)。即便如此,我还是测试了它是否可以在同一文件夹中编译,并且我无法想象它不能覆盖该文件

我希望我对我的解释足够好。 我使用Rust来编译带有wasm-pack的Webassembly,尽管我希望能够直接导入wasm。 作为网络服务器,我还使用一个使用actix web用Rust编写的服务器。

抱歉,如果我想问些很愚蠢的事情,请先感谢,但是大多数人使用webpack / node,并且我没有发现任何可以澄清我的信息。

Project tree

解决方法

此代码解决了我的问题:

import init,{ exported_wasm_func } from '../pkg/network_calculator_lib.js';
async function run() {
    await init(); // You need to call init before wasm functions.
    document.body.textContent = exported_wasm_func();
}
run()

对于遇到类似问题的人:

  • 使用网络目标选项wasm-pack build --target web编译锈。
  • 在HTML中,JS文件或代码必须为模块类型:<script type="module" src="./scripts/js/index.js"></script>
  • 在Cargo.toml中:
[lib]
crate-type = ["cdylib"]
[dependencies]
wasm-bindgen = "0.2"
  • 不是真的需要Package.json。

来源:https://aralroca.com/blog/first-steps-webassembly-rust