# {{projectName}}

## 项目结构

```
{{projectName}}/
├── .husky/                 # Git钩子
├── .vscode/                # VS Code配置
├── env/                    # 环境变量
├── public/                 # 公共资源
├── src/                    # 源代码
│   ├── components/         # 组件
│   ├── views/              # 页面
│   ├── router/             # 路由配置
│   ├── stores/             # 状态管理
│   ├── utils/              # 工具函数
│   ├── assets/             # 静态资源
│   ├── styles/             # 样式文件
│   ├── types/              # 类型定义
│   ├── App.vue             # 根组件
│   └── main.ts             # 入口文件
├── .browserslistrc         # 浏览器兼容配置
├── .editorconfig           # 编辑器配置
├── .gitattributes          # Git属性配置
├── .gitconfig              # Git配置
├── .gitignore              # Git忽略文件
├── .lintstagedrc           # lint-staged配置
├── .pnpmrc                 # pnpm配置
├── .prettierignore         # Prettier忽略文件
├── babel.config.js         # Babel配置
├── commitlint.config.js    # commitlint配置
├── eslint.config.js        # ESLint配置
├── index.html              # 入口HTML文件
├── package.json            # 项目依赖配置
├── prettier.config.js      # Prettier配置
├── tsconfig.ts             # TypeScript配置
├── vite.config.ts          # Vite配置
└── README.md               # 项目说明文档
```

## 特性

- ⚡️ [Vue 3](https://vuejs.org/) +
  [TypeScript](https://www.typescriptlang.org/)
- 🚀 [Vite](https://vitejs.dev/) 构建工具
- 📦 [Pinia](https://pinia.vuejs.org/) 状态管理
- 🛣️ [Vue Router](https://router.vuejs.org/) 路由管理
- 🎨 [Tailwind CSS](https://tailwindcss.com/) 样式框架
- 📏 [ESLint](https://eslint.org/) + [Prettier](https://prettier.io/) 代码规范
- 🧪 [Vitest](https://vitest.dev/) 单元测试
- 🔧 统一的开发环境配置

## 快速开始

### 环境要求

- Node.js >=22.12.0
- npm >= 9.0.0

### 安装依赖

```bash
npm install
```

### 开发

```bash
npm run dev
```

### 构建

```bash
# 构建
npm run build:[mode]
```

### 预览

```bash
npm run preview
```

### 测试

```bash
# 运行测试
npm run test

# 单元测试
npm run test:unit

# 测试覆盖率
npm run test:coverage
```

### 代码规范

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

# 自动修复
npm run lint:fix

# 代码格式化
npm run format

# 类型检查
npm run type-check
```

## 开发指南

### 目录说明

- `src/components/` - 可复用的Vue组件
- `src/views/` - 页面级组件
- `src/router/` - 路由配置文件
- `src/stores/` - Pinia状态管理
- `src/utils/` - 工具函数和辅助方法
- `src/assets/` - 图片、字体等静态资源
- `src/styles/` - 全局样式和主题配置
- `src/types/` - TypeScript类型定义

### 环境变量

项目支持多环境配置：

- `.env.client.android` - Android客户端环境变量
- `.env.client.window` - Windows客户端环境变量
- `.env.lkl.develop` - 拉卡拉开发环境
- `.env.lkl.pre` - 拉卡拉预发布环境
- `.env.lkl.gray` - 拉卡拉灰度环境
- `.env.lkl.prod` - 拉卡拉生产环境
- `.env.tcsl.develop` - 商龙开发环境
- `.env.tcsl.pre` - 商龙预发布环境
- `.env.tcsl.gray` - 商龙灰度环境
- `.env.tcsl.prod` - 商龙生产环境

### 代码规范

项目使用ESLint和Prettier来保证代码质量和风格一致性：

- 保存时自动格式化
- 提交前自动检查和修复
- 支持Vue 3 Composition API
- TypeScript严格模式

### 测试

使用Vitest进行单元测试：

- 支持TypeScript
- 与Vite配置共享
- 支持Vue组件测试
- 内置代码覆盖率报告

## 许可证

MIT