1***@163.com
1***@163.com
  • 发布:2026-02-25 11:49
  • 更新:2026-02-25 11:50
  • 阅读:28

我想使用uniapp x 开发一个app和小程序,有没有封装好的架构直接使用

分类:uni-app x

希望大家给我推荐几个架构

2026-02-25 11:49 负责人:无 分享
已邀请:
Ask小助手

Ask小助手 - Ask社区AI助手

欢迎到专业群( uni-app x技术交流群 ) 咨询,群中有相关专业的管理员和群友。

目前社区里已经沉淀了几套可以直接拿来用的 uni-app x 架构/脚手架,都是把目录结构、路由、状态管理、网络层、UI 库、原生插件调用等常见能力提前封装好,开箱即用。下面给你 3 个最常用、维护活跃的推荐,全部来自官方插件市场,可直接在 HBuilderX 导入:

  1. uni-app x 官方示例工程(hello-uni-app-x)
    地址:https://ext.dcloud.net.cn/plugin?id=16369
    特点:
    • 官方持续维护,覆盖 uvue 页面、uts 插件、uniCloud、支付、地图、推送等常见场景
    • manifest.json、uni_modules、原生 SDK 集成示例齐全,可直接当“母工程”二开
    • 内含 TMUI4.0 全套组件,已做跨端兼容(Android/iOS/鸿蒙/小程序/Web)

  2. TMUI4.0 脚手架(插件大赛一等奖)
    地址:https://ext.dcloud.net.cn/plugin?id=16369
    特点:
    • 以 uni-app x + TMUI4.0 为核心,目录结构按业务模块分层(pages、store、api、utils、components)
    • 内置 request.uts 网络层封装、路由跳转封装、权限管理、主题切换、暗黑模式
    • 支持 App-Android、App-iOS、鸿蒙 Next、微信小程序、H5 同时运行

  3. Lime-UI + Vite 轻量脚手架
    地址:https://ext.dcloud.net.cn/plugin?id=24497
    特点:
    • 免费开源,体积小,适合对包体敏感或想自己再二次封装的团队
    • 目录结构简单:src/pages、src/composables、src/utils、src/static
    • 已集成 lime-ui 组件库、uni-request-x 网络库、pinia-x 状态管理(uts 版)

使用步骤(以 TMUI4.0 脚手架为例)

  1. HBuilderX → 文件 → 导入 → 从插件市场导入 → 输入插件 ID 16369 → 选择「创建工程」
  2. 打开 manifest.json 填好 appid、微信小程序 appid 等配置
  3. 终端执行「运行到小程序模拟器」或「运行到手机/模拟器」即可看到示例页面
  4. 业务开发直接在 src/pages 新建 .uvue 页面,路由自动注册;网络请求统一写在 src/api 目录,已封装 request.uts

注意事项
• uni-app x 的页面后缀必须是 .uvue,样式用 ucss,逻辑用 uts;老 uni-app 项目无法一键迁移,需要重写。
• 如果只做微信小程序,官方建议先用 uni-app(js 引擎版),生态更成熟;uni-app x 目前主打 App 原生性能。
• 遇到组件/API 缺失,先在插件市场搜 uts 插件;没有就自己用 uts 封装原生代码,官方文档有完整示例。

以上三套脚手架都能直接跑通 App+小程序双端,你可以按团队规模、UI 需求、付费/开源偏好三选一。

内容为 AI 生成,仅供参考

要回复问题请先登录注册