# AppYlPrototype

**Repository Path**: work_project_item/app-yl-prototype

## Basic Information

- **Project Name**: AppYlPrototype
- **Description**: 设备管理APP端设计
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: main
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-04-27
- **Last Updated**: 2025-04-28

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# AppYlPrototype

这是一个基于Vue3 + Vite + Pinia的移动端应用原型项目，使用Vant UI组件库构建。

## 技术栈

- 框架：Vue3 + Vite
- 状态管理：Pinia
- 路由：Vue Router
- UI组件库：Vant
- 代码调试：Vite DevTools（支持局域网访问）
- 图标库：Vant UI图标库 + 阿里巴巴图标库

## 移动端适配

本项目已针对移动端进行了优化配置：

1. 视口设置
   - 禁止用户缩放
   - 适配不同屏幕尺寸
   - 使用rem单位进行布局

2. 触摸优化
   - 支持触摸滚动
   - 优化点击反馈
   - 防止页面抖动

3. 性能优化
   - 压缩代码
   - 移除console
   - 优化资源加载

## 项目结构

```
src/
├── assets/         # 静态资源文件
├── components/     # 公共组件
├── router/         # 路由配置
├── stores/         # Pinia状态管理
├── views/          # 页面视图
├── App.vue         # 根组件
└── main.js         # 入口文件
```

## 开发规范

### 命名规范
- 变量：使用驼峰命名法，禁止使用数字后缀
- 函数：使用驼峰命名法，禁止使用数字后缀
- 组件：使用驼峰命名法，禁止使用数字后缀

### 代码质量要求
- 组件必须按照JavaScript的类型来使用
- 函数长度不超过20行
- 单个页面不超过200行，功能需拆分为多个组件
- 重复的代码逻辑必须抽取为公共的工具函数
- 代码必须符合ESLint、Prettier、Vue、Vue Router和Pinia的规范
- 严格审查代码依赖包是否正常安装

### 代码注释
- 复杂逻辑必须添加清晰明了的注释
- 注释应写在函数上方

### 组件开发规范
- 表单组件：必须包含表单验证和错误提示
- 列表组件：必须包含分页和排序功能
- 列表状态：必须考虑加载中、空数据、错误和加载完成状态

## 开发指南

### 安装依赖
```bash
npm install
```

### 开发环境运行
```bash
npm run dev
```

### 构建生产环境
```bash
npm run build
```

### 代码格式化
```bash
npm run format
```

### 代码检查
```bash
npm run lint
```

### 端到端测试
```bash
npm run test:e2e
```

## 功能模块

### 页面导航
使用Vant的导航组件实现页面间的跳转和导航。

### 错误处理
统一使用Vant的Message组件进行错误提示。

### 页面风格
采用Vant的经典风格，确保UI统一性和良好的用户体验。

## 注意事项

1. 所有组件必须按功能分组，每个功能一个文件夹，每个文件夹一个组件
2. 导包必须严谨，避免成员导出错误
3. 代码必须符合JavaScript的类型定义
4. 遇到依赖包安装错误时，需要检查错误原因并修复
5. 移动端开发时注意：
   - 使用rem单位进行布局
   - 适配不同屏幕尺寸
   - 优化触摸体验
   - 注意性能优化

## 贡献指南

1. Fork 本仓库
2. 创建新的功能分支
3. 提交代码
4. 创建 Pull Request

## 许可证

MIT License