From adbc3f83983f6603015d949d6d93d9f2911c44b4 Mon Sep 17 00:00:00 2001
From: cruld <cruldra@gmail.com>
Date: Sun, 30 Mar 2025 00:41:06 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=93=9D=20docs(clinerules):=20add=20cliner?=
 =?UTF-8?q?ules=20for=20Refine=20Admin=20development?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 添加Refine Admin开发最佳实践与规范文档
- 包含技术栈、依赖管理、项目结构等内容
---
 Typescript/Refine Admin/clinerules | 97 ++++++++++++++++++++++++++++++
 1 file changed, 97 insertions(+)
 create mode 100644 Typescript/Refine Admin/clinerules

diff --git a/Typescript/Refine Admin/clinerules b/Typescript/Refine Admin/clinerules
new file mode 100644
index 0000000..b4eda27
--- /dev/null
+++ b/Typescript/Refine Admin/clinerules	
@@ -0,0 +1,97 @@
+---
+description: Refine Admin开发最佳实践与规范
+---
+
+# Refine Admin开发规范
+
+## 技术栈
+
+- Typescript
+- React
+- Refine
+- Unocss
+- Vite
+- Zustant
+- Antd
+
+## 依赖管理
+
+- 使用`pnpm`管理依赖
+
+## 项目结构
+
+- 项目整体结构如下:
+
+    ```markdown
+        $PROJECT_ROOT
+        ├── src
+        │   ├── $RESOURCE_MODULE1 # 资源模块1
+        │   ├── $RESOURCE_MODULE2 # 资源模块2
+        ├── App.tsx # 主应用及路由配置
+        ├── index.tsx # 入口文件
+        ├── uno.d.ts # unocss类型声明
+        ├── .env # 环境变量
+        ├── .env.development # 开发环境变量
+        ├── .env.production # 生产环境变量
+        ├── .gitignore # git忽略文件
+        ├── .cursorrules # cursor规则
+        ├── .clinerules # 项目规范/ClineRules
+        ├── .windsurfrules # 项目规范/WindsurfRules
+    ```
+- 采用模块化设计,每个模块位于`$PROJECT_ROOT/src`目录下,其结构如下:
+
+    ```markdown
+        $RESOURCE_MODULE1
+        ├── components  # 组件
+        │   ├── Cmp1.tsx
+        │   ├── index.ts
+        ├── contexts  # 上下文
+        │   ├── Ctx1.tsx
+        │   ├── index.ts
+        ├── layouts  # 布局
+        │   ├── Layout1.tsx
+        │   ├── index.ts
+        ├── pages  # 页面
+        │   ├── Create.tsx
+        │   ├── Edit.tsx
+        │   ├── index.ts
+        │   └── View.tsx
+        ├── stores  # 状态管理
+        │   ├── index.ts
+        │   └── Store1.ts
+        ├── schemas.ts  # 类型定义
+        ├── consts.tsx  # 常量
+        ├── api.ts  # 接口
+        ├── index.ts  # 入口
+        └── utils.ts  # 工具函数
+    ```
+
+
+## 样式
+
+- 使用`unocss`作为样式框架
+
+## 图标
+
+- 使用`react-icons`作为图标库
+
+## 代码风格
+
+- 所有`tsx`组件使用大驼峰命名法
+- 所有`tsx`组件使用箭头函数定义
+- `Refine`的`resource`是实体类的小驼峰命名法，比如`EntityName`，在`Refine`中使用`entityName`
+
+
+## 路由
+
+- 使用`react-router`作为路由库
+- 新增资源管理模块后，需要在`src/App.tsx`中注册资源管理模块
+
+
+## 枚举
+
+- 在`$RESOURCE_MODULE/consts.tsx`中为枚举定义颜色映射以及转换为`antd`的`Select Option`和`Tag`
+
+## 页面
+
+- 列表页中如果要展示关联的实体，则需要使用`common/components/RecordName.tsx`组件