# Frontend Framework (Vue 3 + TypeScript + Vite)

面向小型开发团队的通用前端框架模板，提供清晰目录、可复用示例、统一配置与约定。

## 目录结构

project
├── interface/ # 📝 业务模型接口定义
├── public/ # 🌐 公共资源，打包会直接打进根目录
├── src
│ ├── api/ # 🔌 请求后端接口
│ ├── assets/ # 🖼 静态资源
│ ├── components/ # 🧩 公共基础组件
│ ├── directive/ # ⚡ 全局指令
│ ├── layout/ # 📐 布局组件
│ ├── router/ # 🛣 路由配置
│ ├── stores/ # 🗄 全局状态管理
│ ├── styles/ # 🎨 全局样式
│ ├── utils/ # 🛠 工具类
│ └── views/ # 📄 业务页面
├── tests/ # 🧪 测试目录
│ ├── unit/ # 单元测试（Vitest）
│ ├── e2e/ # E2E 测试
│ ├── setup.ts # 测试环境配置
│ └── utils/ # 测试工具函数
├── types/ # 📋 全局类型声明
├── vitest.config.ts # 🧪 Vitest 配置
└── package.json

## 示例说明

- `src/api/`：`modules/demo.ts` 演示接口调用
- `src/stores/`：`useCounter.ts` 演示 Pinia Store
- `src/directive/`：`focus.ts` 演示自定义指令
- `src/layout/`：`BasicLayout.vue` 演示布局壳
- `src/views/Test`：演示使用 store + api + composable
