项目基于 uni-app x 框架开发,核心定位为跨端发贴社区应用,主要功能模块包括:
发贴模块:用户输入标题与正文,提交后实时写入首页列表,支持本地数据持久化存储。
首页列表模块:按时间倒序展示所有帖子,列表项支持点击查看详情,包含标题、摘要、发布时间等元信息。
跨端渲染层:基于 Vue 3 Composition API + UTS 类型系统编写业务逻辑,编译器将 UTS 转换为各端原生代码(Android 端输出 Kotlin),保证原生性能。
H5 静态构建模块:通过 HBuilderX 发行 H5 站点,产物可部署到任意静态服务器,支持 PC / 手机浏览器访问,局域网内手机可通过 IP 直接访问。
类型系统与数据传递:定义 Post 接口规范业务数据结构,组件间通过对象直传而非下标访问,提升代码可维护性。
我作为独立开发者完成本项目从架构设计到多端打包的全流程:
架构设计:确定 uni-app x + Vue 3 + UTS 技术选型,使用 Composition API 组织页面逻辑,定义统一 Post 接口规范数据模型。
核心开发:编写首页列表、发贴、详情等页面,实现数据双向绑定与组件间通信。
跨端编译调优:解决 UTS 编译期 Unresolved reference: Post 问题,通过 import type { Post } 引入类型 + as Post 强类型断言修复类型推导。
多端打包验证:完成 H5 静态站点构建(npx serve 本地预览 + 局域网真机访问),并完成 Android 云端打包全流程。
技术亮点:跨端一致性(同一份 UTS 代码同时支持 Android 原生与 H5 webview);强类型系统降低运行时错误;Vue 3 响应式自动驱动 UI 更新。
技术栈:uni-app x、Vue 3、UTS、HBuilderX、Node.js v22。