# CLAUDE.md - sie-front-demo 前端规范入口

本文件是 Claude Code / AI Agent 在 `sie-front-demo` 仓库工作的规则入口。

## 必读原则

在生成或修改页面、组件、API、语言包之前，先按任务类型读取 `.claude/rules/INDEX.md` 中列出的对应规则文件。不要仅凭记忆生成 `@gushen` 组件用法；涉及组件 API 时，优先参考 `node_modules/@gushen/*/src` 源码和本规则。

## 项目概况

| 项目 | 值 |
|---|---|
| 仓库名 | `sie-front-demo` |
| 框架 | Vue 3 + TypeScript + Element Plus |
| 构建工具 | Vite |
| 状态管理 | Pinia（兼容 PiniaToVuex 写法） |
| 路由 | Vue Router 4 |
| 国际化 | `src/lang`，覆盖 `zh-cn`、`en-us`、`zh-tw` 等多语言模块 |
| 公共组件 | `@gushen/gushen-common-components` 全局注册 |
| 动态表单 | `@gushen/gushen-form-render` 依赖存在，当前插件注册默认注释 |
| 菜单路由 | 静态路由少，业务页主要由 `src/permission.ts` 按后台菜单动态加载 |

## 规则索引

完整索引见 `.claude/rules/INDEX.md`。

| 规则文件 | 适用场景 |
|---|---|
| `.claude/rules/project-overview.md` | 了解工程结构、入口、路由、全局注册 |
| `.claude/rules/gushen-components.md` | 使用 `@gushen` 组件、表格、查询栏、上传、选择器 |
| `.claude/rules/page-development-rules.md` | 新增列表页、表单页、流程页、动态表单页 |
| `.claude/rules/api-i18n-rules.md` | 新增 API、请求参数、成功判断、多语言文案 |
| `.claude/rules/page-template-index.md` | 统一页面模板索引（基础表单、CRUD、树表、Tab 中心、模板中心、日志分析等） |

## 技能工具

| 技能 | 触发词 | 说明 |
|---|---|---|
| `generate-vue3-page` | 生成页面、新增页面、根据接口/配置生成页面、开发列表页、开发表单页 | 按当前工程模板生成 Vue3 页面、API、路由和语言包修改建议 |

## 常用命令

```bash
npm run dev
npm run build
npm run type-check
npm run lint
```

## 关键路径

| 类型 | 路径 |
|---|---|
| 应用入口 | `src/main.ts` |
| 插件与全局属性 | `src/core/initMain.ts` |
| 路由 | `src/router/index.ts` |
| 动态菜单路由 | `src/permission.ts` |
| 本地全局组件注册 | `src/components/global-register.ts` |
| 页面目录 | `src/views` |
| API 目录 | `src/api` |
| 语言包 | `src/lang`、`src/lang/modules` |
| Gushen 组件源码参考 | `node_modules/@gushen/gushen-common-components/src/packages/components` |