2026-03-17 14:49:40 +08:00
2026-03-17 14:49:40 +08:00

AI学习助手 - UNIAPP 多端应用

项目概述

企业级多端应用项目,基于 UNIAPP 框架开发支持微信小程序、H5、App 三端运行。

技术栈

  • 核心框架UNIAPP (Vue 3 + Vite)
  • 状态管理Pinia
  • 样式方案Scss + UniApp 内置样式变量
  • 网络请求:统一封装的 request 工具
  • 代码规范ESLint + Prettier + Husky

快速开始

# 安装依赖
npm install

# 运行微信小程序
npm run dev:mp-weixin

# 运行 H5
npm run dev:h5

# 运行 App
npm run dev:app

详细说明请查看 快速开始.md

项目特性

模块化架构设计
统一的状态管理
完善的错误处理
多端适配方案
性能优化策略
代码规范约束

核心功能模块

  1. AI助手 - 智能对话和心理辅导功能
  2. 咨询 - 在线咨询服务
  3. 测评 - 心理测评功能
  4. 课程 - 学习课程管理
  5. 我的 - 个人中心

文档

项目结构

├── src/
│   ├── api/              # API 接口模块
│   ├── components/       # 通用组件
│   │   └── common/       # 公共组件Loading、Empty、Error
│   ├── config/          # 配置文件
│   │   ├── constants.js # 常量配置
│   │   └── env.js       # 环境配置
│   ├── mixins/          # Vue 混入
│   │   ├── pageMixin.js # 页面混入
│   │   └── listMixin.js # 列表混入
│   ├── pages/           # 页面文件
│   │   ├── aibot/       # AI助手页面
│   │   ├── message/     # 咨询页面
│   │   ├── target/      # 测评页面
│   │   ├── library/     # 课程页面
│   │   ├── cloud/       # 我的页面
│   │   └── login/       # 登录页面
│   ├── static/          # 静态资源
│   │   ├── icons/       # 图标文件
│   │   ├── images/      # 图片文件
│   │   └── tabbar/      # TabBar 图标
│   ├── store/           # Pinia 状态管理
│   │   └── modules/     # 状态模块
│   ├── styles/          # 全局样式
│   │   ├── common.scss  # 公共样式
│   │   ├── variables.scss # 样式变量
│   │   ├── mixins.scss  # 样式混入
│   │   └── tabbar.scss  # TabBar 样式
│   ├── utils/           # 工具函数
│   │   ├── request.js   # 网络请求
│   │   ├── storage.js   # 本地存储
│   │   ├── validator.js # 数据校验
│   │   ├── platform.js  # 平台判断
│   │   └── performance.js # 性能优化
│   ├── App.vue          # 应用入口
│   ├── main.js          # 主入口文件
│   ├── pages.json       # 页面配置
│   └── manifest.json    # 应用配置
├── docs/                # 文档目录
├── tests/               # 测试文件
├── .eslintrc.js        # ESLint 配置
├── .prettierrc.js      # Prettier 配置
├── vite.config.js      # Vite 配置
└── package.json        # 项目配置

开发注意事项

TabBar 配置

  • 字体PingFang SC, Weight 600, Size 11px
  • 颜色:未选中 #A1A1AA选中 #27272A
  • 图标位置:src/static/tabbar/

AI助手页面

  • 使用自定义导航栏
  • 背景图使用在线 URL
  • 功能卡片支持横向滚动
  • 暂时使用 emoji 作为图标占位符

静态资源

功能卡片图标需要准备以下文件(详见 图标准备说明.md

  • diary.png - 心情日记
  • emotion.png - 情绪分析
  • stress.png - 压力测评
  • meditation.png - 冥想放松
  • sleep.png - 睡眠助手

环境配置

项目支持三种环境:

  • 开发环境 (development)
  • 测试环境 (test)
  • 生产环境 (production)

环境配置文件:src/config/env.js

代码规范

  • 使用 ESLint 进行代码检查
  • 使用 Prettier 进行代码格式化
  • 使用 Husky 进行 Git 提交前检查
  • 遵循 Vue 3 组合式 API 最佳实践

浏览器支持

  • Chrome >= 87
  • Firefox >= 78
  • Safari >= 14
  • Edge >= 88

小程序支持

  • 微信小程序基础库 >= 2.10.0

许可证

MIT

联系方式

如有问题,请联系开发团队。

Description
大白前端仓库_只放前端
Readme 408 KiB