# Arco Design Pro Vite

基于 [Arco Design Pro](https://arco.design/pro/) 的 Vue 3 中后台模板，使用 Vite 8 + Pinia + TypeScript 构建。

## 环境要求

- Node.js >= 20.19.0
- pnpm

## 常用命令

```bash
pnpm install    # 安装依赖
pnpm dev        # 开发服务器
pnpm build      # 生产构建
pnpm report     # 构建并生成 bundle 分析报告
pnpm type:check # TypeScript 检查
pnpm lint       # Biome 代码检查
pnpm lint:fix   # 自动修复
```

## 目录结构

```
src/
├── api/           # 接口定义（按业务域）
├── assets/        # 静态资源与全局样式
├── components/    # 全局 / 布局级组件
├── directive/     # 自定义指令
├── hooks/         # 组合式函数
├── layout/        # 页面布局
├── locale/        # i18n 入口与全局文案
├── mocks/         # Mock 数据（开发环境）
│   ├── handlers/  # 全局 mock 处理器
│   └── setup.ts   # mock 启用与响应包装
├── plugins/       # 应用插件（如 HTTP 拦截器）
├── router/        # 路由与守卫
├── store/         # Pinia 状态
├── types/         # 全局类型
├── utils/         # 工具函数
└── views/         # 页面（每页可含 components/、locale/、mock.ts）
config/
└── vite.config.ts # Vite 配置
public/            # 静态公共资源
```

## Mock 说明

仅在开发环境（`import.meta.env.DEV`）下，`main.ts` 会动态加载 `src/mocks/index.ts`；生产构建不会打入 mockjs。

- 全局 handler 位于 `mocks/handlers/`
- 页面级 mock 保留在 `views/**/mock.ts`，由 `import.meta.glob` 自动注册

## 环境变量

| 变量 | 说明 |
|------|------|
| `VITE_API_BASE_URL` | 后端 API 地址（见 `.env.development`） |
| `VITE_ERROR_REPORT_URL` | 可选，配置后启用前端错误上报（`utils/error-report.ts`） |

## i18n 说明

- 菜单等全局文案：`locale/zh-CN.ts`、`locale/en-US.ts`
- 页面文案：`views/**/locale/` 与 `components/**/locale/`，通过 `import.meta.glob` 自动聚合

## 模板标记

路由与部分功能块带有 `/** simple */` … `/** simple end */` 注释，表示 Arco Pro「精简版 / 完整版」的可选模块边界。