资源
⚠️ 支持：Manganis目前处于alpha阶段。计划进行API更改，可能会出现更多错误。
资源是包含在应用程序最终构建中的文件。它们可以是图像、字体、样式表或任何其他非源文件。Dioxus为资源提供了一流的支持，并提供了一种简单的方式来在应用程序中包含它们，并自动为生产环境优化它们。
Dioxus中的资源也与库兼容！如果你正在构建一个库，你可以在库中包含资源，它们将自动包含在任何使用你的库的应用程序的最终构建中。
首先，你需要在Cargo.toml文件中添加manganis包：
包含图像
要在你的应用程序中包含一个资源，你只需将资源的路径包装在mg!调用中即可。例如，要在应用程序中包含一个图像，你可以使用以下代码：
use dioxus::prelude::*;
use manganis::*;
fn App() -> Element {
// 你可以链接到相对于包根的资源，甚至可以从URL链接到资源
// 这些资源将自动被Dioxus CLI捕获、优化，并与你的最终应用程序捆绑在一起
const ASSET: manganis::ImageAsset = manganis::mg!(image("./public/static/ferrous_wave.png"));
rsx! { img { src: "{ASSET}" } }
}
你还可以使用mg!宏优化、调整大小和预加载图像。选择优化的文件类型（如WebP）和合理的质量设置可以显著减少你的图像大小，这有助于你的应用程序更快地加载。例如，你可以使用以下代码在应用程序中包含一个优化的图像：
pub const ENUM_ROUTER_IMG: manganis::ImageAsset =
manganis::mg!(image("./public/static/enum_router.png")
// Manganis在宏内部使用构建器模式。你可以在编译时设置图像大小（以像素为单位），以向客户端发送尽可能小的图像
.size(52, 52)
// 你还可以将图像转换为编译时的网络友好格式。这可以使你的图像更小
.format(ImageType::Avif)
// 你甚至可以告诉Manganis预加载图像，以便在需要时立即显示
.preload());
fn EnumRouter() -> Element {
rsx! { img { src: "{ENUM_ROUTER_IMG}" } }
}
包含任意文件
在Dioxus桌面中，你可能想要包含一个包含应用程序数据的文件。你可以使用file函数在应用程序中包含任意文件。例如，你可以使用以下代码在应用程序中包含一个文件：
// 你还可以收集任意文件。相对路径是相对于包根解析的
const PATH_TO_BUNDLED_CARGO_TOML: &str = manganis::mg!(file("./Cargo.toml"));
// 你可以使用URL在构建时复制资源
const PATH_TO_BUNDLED_AWESOME_DIOXUS: &str = manganis::mg!(file("https://dioxuslabs.com/awesome"));
这些文件将自动包含在你的应用程序的最终构建中，你可以像使用任何其他文件一样在应用程序中使用它们。
包含样式表
你可以使用mg!宏在应用程序中包含样式表。例如，你可以使用以下代码在应用程序中包含一个样式表：
// 你还可以将样式表与你的应用程序捆绑在一起
// 任何以.css结尾的文件，即使你没有在<head>中显式包含它们，也会被压缩并与你的应用程序捆绑在一起
const _: &str = manganis::mg!(file("./tailwind.css"));
Tailwind指南提供了更多关于如何在Dioxus中使用Tailwind的信息。
结论
Dioxus为资源提供了一流的支持，使得在应用程序中包含它们变得容易。你可以在应用程序中包含图像、任意文件和样式表，Dioxus将自动为生产环境优化它们。这使得在应用程序中包含资源并确保它们为生产环境优化变得容易。
你可以在Manganis文档中阅读更多关于资源的信息以及所有可用的资源优化选项。
