# react-admin-template

**Repository Path**: msxn/react-admin-template

## Basic Information

- **Project Name**: react-admin-template
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2026-04-22
- **Last Updated**: 2026-05-10

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# React Admin Template

基于 `React 19`、`TypeScript`、`Vite`、`Sass` 和 `React Router v7` 的后台前端模板。

当前仓库已经从默认的 Vite 示例页调整为可继续扩展的项目骨架，包含基础页面、布局、路由和常用目录拆分。

## 技术栈

- `React 19`
- `TypeScript`
- `Vite 8`
- `React Router DOM 7`
- `Sass`
- `ESLint + Prettier`

## 项目目录

```text
src/
├── assets/           # 图片、字体、静态资源
├── components/       # 公共组件（Button、Header 等）
├── layouts/          # 页面布局（MainLayout、AuthLayout）
├── pages/            # 页面（Home、About、Login）
├── styles/           # 全局 Sass（variables、mixins、reset、global）
├── utils/            # 工具函数（request、format）
├── hooks/            # 自定义 Hooks
├── services/         # API 请求封装
├── router/           # React Router v7 路由配置
├── types/            # TypeScript 类型定义
├── App.tsx           # 根组件
├── index.css         # 入口基础样式
├── index.tsx         # 入口文件（React 19 createRoot）
└── vite-env.d.ts     # Vite 类型声明
```

## 页面与路由

- `/`：首页，展示项目骨架说明
- `/about`：目录结构说明页
- `/login`：登录布局示例页

路由统一维护在 [src/router/index.tsx](/D:/workspace/msxn/Code/react-admin-template/src/router/index.tsx)。

## 快速开始

```bash
npm install
npm run dev
```

生产构建：

```bash
npm run build
```

## 开发约定

- 页面级逻辑放在 `src/pages`
- 公共布局放在 `src/layouts`
- 公共组件放在 `src/components`
- 接口请求统一从 `src/services` 发起，底层能力放在 `src/utils/request.ts`
- 全局样式集中在 `src/styles`
- 应用入口使用 `src/index.tsx`

## 后续扩展建议

- 在 `src/services` 中按模块拆分 API，例如 `user.ts`、`auth.ts`、`dashboard.ts`
- 在 `src/router` 中继续补充权限路由、懒加载和 404 页面
- 在 `src/types` 中沉淀接口返回值、表单模型和业务枚举
- 结合 `components` 和 `hooks` 持续抽离复用逻辑

---

## Harness 开发工作流

本项目基于 **Long-Running Agent Harness v3.5** 设计，支持多会话开发和 Agent Teams 协作。

### 核心文件

| 文件/目录 | 说明 |
|-----------|------|
| `.harness/` | Harness 根目录，存放特征跟踪和上下文 |
| `.harness/features.json` | 特征跟踪列表（F001、F002...） |
| `.harness/context_summary.md` | 架构决策、模式和陷阱记录（每次会话必读） |
| `.harness/harness.json` | 项目元数据、Git 身份、团队结构 |
| `.harness/init.sh` | 构建/测试脚本（smoke_test / full_test） |
| `.claude/hooks/` | 质量门禁钩子 |

### Hooks 质量门禁

| Hook | 触发时机 | 作用 |
|------|----------|------|
| `enforce-scope.sh` | Edit/Write 前 | 阻止修改范围外的文件 |
| `verify-git-identity.sh` | Bash git 命令前 | 验证 Git 身份一致性 |
| `verify-task-quality.sh` | TaskCompleted | 运行测试，失败则拒绝 |
| `check-remaining-tasks.sh` | TeammateIdle | 检查剩余特征，驱动连续工作 |
| `post-task-complete.sh` | TaskCompleted 后 | 更新特征状态和进度 |

### 特征工作流

```
特征定义 → scope 划定 → 实现 → 测试验证 → status: "passing"
```

特征完成标准：
- `status` = `"passing"`
- `test_file` 指向测试文件
- `coverage` >= 95%

### 开发会话流程

1. **会话开始**：读取 `.harness/context_summary.md` + `TaskList`
2. **开发中**：严格在 assigned scope 内工作
3. **会话结束**：更新 `features.json` 状态 + `claude-progress.txt`
4. **上下文压缩后**：立即恢复状态再继续

### 团队协作（可选）

如启用 Agent Teams：
- 每个 teammate 有独立 scope
- Reviewer 角色负责代码审查
- 通过 `team-lead` 协调任务分配