#903 在 Web编程

每月 29次下载

MIT/Apache

18KB
234 行

Web Bundler

通过build.rs脚本管理构建WebAssembly单页应用前端，以便它们可以轻松嵌入到Rust API项目中。

内部，该打包器使用wasm-pack进行实际的WebAssembly编译。

先决条件

从基于Rustup的纯净Rust安装中，无需额外步骤。Web Bundler将下载并安装它所需的任何依赖项。

对于未使用Rustup完成的Rust安装，您需要手动添加wasm32-unknown-unknown编译目标（有关如何操作的详细信息，请参阅wasm-pack文档）。

在示例目录中有一个示例用法。要运行示例，请打开示例目录中的终端并运行cargo run。然后，打开Web浏览器并导航到http://localhost:3030/。您应该看到一个Seed Web应用程序。

Web-bundler期望您有两个项目：一个使用单页应用框架（如Seed）的前端项目，以及一个使用Web服务器框架（如warp）的后端项目。这些项目应在公共工作空间中。

更新您的index.html以允许在JavaScript和CSS中进行模板化。

具体来说，您需要将 {{ stylesheet | safe }} 添加到 <head> 部分，并将 {{ javascript | safe }} 添加到 <body> 的末尾。如果需要设置基本 URL，还可以将 <base href="{{ base_url }}"> 添加到 <head> 中。

请参阅示例前端 index.html。
为您的应用程序创建一个根样式表，命名为 ./css/style.scss。

此样式表将被编译为 CSS，并直接嵌入到您的 index.html 文件中。

请参阅示例前端 style.scss。
将所有静态资源放入 static 目录

静态目录中的所有文件将被直接复制到输出目录中的静态文件夹。

请参阅示例前端静态目录。

更新您的 Cargo.toml 以依赖前端项目和 web-bundler

我们在 Cargo.toml 中依赖前端项目，以便 Cargo 在前端项目更改时重新运行 build.rs。

请参阅示例后端 Cargo.toml。
添加一个 build.rs 脚本，用于调用前端 web-bundler

请参阅示例后端 build.rs。
使用 Rust Embed 将构建好的前端嵌入到您的 API 二进制文件中

请参阅示例后端 main.rs。我们的示例使用了 warp 网络服务器。Rust Embed 还在它们的存储库中提供了其他网络服务器的示例。

当 web-bundler 编译前端时，它会覆盖默认的目标目录，将其改为 web-target 而不是 target。这是因为在后端和前端位于同一工作空间中时，Cargo 会运行 build.rs 脚本时锁定 target。

^{根据您的选择，受 Apache License，版本 2.0 或 MIT 许可证的许可。}
_{除非您明确声明，否则您根据 Apache-2.0 许可证定义的任何有意提交以包含在此软件包中的贡献，将根据上述条款双许可，而无需任何额外的条款或条件。}

~24–38MB
~629K SLoC