跳至主要内容
版本:0.21

部署

当您准备将 Yew 应用程序部署到服务器时,您有各种部署选项。

trunk build --release 以发布模式构建您的应用程序。设置您的 HTTP 服务器,以便每当访问您的网站时,它都会提供 index.html,并且对静态路径(如 index_<hash>.jsindex_bg_<hash>.wasm)的请求会提供 trunk 生成的 dist 目录中相应内容的内容。

关于 trunk serve --release 的说明

不要在生产中使用 trunk serve --release 来提供您的应用程序。它只应在开发期间用于测试发布版本

服务器配置

index.html 作为后备提供

如果应用程序使用 Yew 路由器,您必须在服务器上配置,以便在请求它没有的文件时返回 index.html

带有 Yew 路由器的应用程序构建为 单页应用程序 (SPA)。当用户从正在运行的客户端导航到某个 URL 时,路由器会解释该 URL 并路由到该页面。

但在全新加载时,例如在地址栏中输入页面或刷新页面时,所有这些操作都由浏览器本身处理,而不在正在运行的应用程序中。浏览器会直接向服务器请求该 URL,绕过路由器。配置错误的服务器将返回状态 404 - 未找到。

相反,通过返回 index.html,应用程序会像往常一样加载,就好像请求的是 /,直到路由器注意到路由是 /show/42 并显示适当的内容。

为 Web Assembly 资产配置正确的 MIME 类型。

WASM 文件必须使用 Content-Type 标头 提供服务,该标头设置为 application/wasm MIME 类型。

大多数服务器和托管服务默认情况下已执行此操作。如果您的服务器没有执行此操作,请查阅其文档。在大多数 Web 浏览器中,不正确的 MIME 类型会导致类似于以下内容的错误

`WebAssembly.instantiateStreaming` failed because your server does not serve wasm with `application/wasm` MIME type. Falling back to `WebAssembly.instantiate` which is slower. Original error:
TypeError: WebAssembly: Response has unsupported MIME type 'text/plain' expected 'application/wasm'

为相对路径构建

默认情况下,trunk 将假定你的网站在 / 处提供服务并相应地构建网站。可以通过向 index.html 文件添加 <base data-trunk-public-url /> 来覆盖此行为。Trunk 会重写此标记以包含传递给 --public-url 的值。Yew 路由器会自动检测 <base /> 的存在并适当地处理它。

使用环境变量自定义行为

通常通过使用环境变量来自定义构建环境。由于应用程序在浏览器中运行,因此我们无法在运行时读取环境变量。std::env! 宏可用于在编译时获取环境变量的值。