Rust-前端 Yew CSR的实战小结
发布网友
发布时间：2024-10-24 09:24
共1个回答
热心网友
时间：2024-10-25 14:43
Yew的开发模式分为SSR和CSR两种，我在这两种模式中均有实践。目前我采用CSR模式。撰写本文的目的是分享在实际项目开发中所遇到的关键步骤及解决策略。
项目采用trunk进行打包，因此首先需要安装trunk命令。配置文件Cargo.toml.env用于在编译时读取dotenv_codegen函数，将配置值写入代码中。在后续的config.rs文件中，我们导出这些值，以供项目使用。
Trunk.toml文件用于配置trunk的行为，尽管并非必需，但对打包流程至关重要。index.html作为浏览器端的入口文件，trunk打包命令会根据data-trunk属性生成相关代码。
main.rs模块包含了项目的基本结构设计。config.rs文件用于项目配置，主要将.env文件中的值在编译时写入到文件中。同时，我们利用thiserror::Error将错误转换成MyError，再进一步转换为yew::html::RenderError，以实现错误信息的统一输出。
errors.rs文件中，我们通过"?"语法糖轻松处理各种错误。关于错误处理的具体实现，可以参考之前的文章。
result.rs文件定义了项目内部使用的Result类型别名，MyError作为错误类型的使用，提供了灵活的错误管理机制。models.rs文件中，我们定义了与API交互的类型以及其他在逻辑处理中可能需要的类型，几乎所有的序列化和反序列化需求都依赖于serde库。
services.rs文件中，我们调用API时进行参数的序列化与返回值的反序列化，同时利用"?"语法糖进行错误处理。utils.rs文件提供了一组工具函数，其中panic_if_err用于处理spawn_local中的错误情况，app.rs文件为项目的中心，与react代码类似，但在Yew中，我们更关注于特定的功能点。
对于项目的调试和打包，我们使用了dev.sh和build-release.sh脚本。此文档将随项目的进展持续更新，目前所实现的功能较为基础，欢迎留言交流。
项目源代码已放置在git目录中，欢迎关注我的Rust-项目开发实战专栏，以便获取最新更新。
