Skip to content

Commit b6059ba

Browse files
authored
[elsa] 添加README (#118)
* [elsa] 添加Elsa模块README * [elsa] 去除多余标识
1 parent 146bef3 commit b6059ba

File tree

1 file changed

+110
-0
lines changed

1 file changed

+110
-0
lines changed

framework/elsa/README.md

Lines changed: 110 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,110 @@
1+
# ELSA 简介
2+
3+
## ✨ 功能亮点
4+
5+
### 核心框架 (framework/elsa)
6+
7+
- **统一的抽象数据结构**
8+
9+
- Graph、Page、Shape结构通用于任意业务场景
10+
- 全链路JSON序列化能力,兼容任何持久化存储方案
11+
- **拖拽式流程编排**
12+
13+
- 支持图形拖拽和画布拖拽,并提供节点整理和一键显示所有节点的能力
14+
15+
### 前端应用 (elsa-react)
16+
17+
- **集成React能力**
18+
19+
- 基于Context的上下文传递
20+
- 节点渲染缓存:React.memo + 自定义shouldComponentUpdate
21+
- **集成Ant Design能力**
22+
23+
- 基于Form组件的实时校验提示系统
24+
- 基于Tree组件封装的节点上下文观察者机制
25+
26+
27+
## 🚀 核心架构概览
28+
### 1. 分层架构
29+
30+
```markdown
31+
├─ fit-elsa-react/ # React前端应用
32+
│ └─ src/ # 前端源代码
33+
└─ fit-elsa/ # 核心框架
34+
├─ common/ # 通用工具
35+
├─ core/ # 工作流运行时引擎
36+
└─ plugins/ # 可扩展插件系统
37+
```
38+
39+
### 2. 技术栈
40+
41+
### **@fit-elsa/elsa-core(核心框架模块)**
42+
43+
#### **核心工具链**
44+
| 类别 | 技术栈 |
45+
| --------- | -------------------------------------------- |
46+
| **构建工具** | Webpack 5 + Babel 7 + Cross-env(多环境配置) |
47+
| **代码转换** | `@babel/preset-env`+`core-js@3`(ES6+ 向下兼容) |
48+
| **依赖管理** | npm scripts(支持 daily/debug/pro 多环境构建) |
49+
50+
#### **关键依赖**
51+
| 类别 | 技术栈 |
52+
| ---------- | ---------------------------------------------- |
53+
| **流程可视化** | `@dagrejs/dagre`(图形布局算法) +`[email protected]`(图表渲染) |
54+
| **国际化** | `[email protected]`(多语言支持) |
55+
| **视频处理** | `[email protected]`(视频播放器集成) |
56+
57+
### @fit-elsa/elsa-react(React 前端模块)
58+
#### **核心框架**
59+
| 类别 | 技术栈 |
60+
| ----------- | ----------------------------------------- |
61+
| **前端框架** | React 18 + TypeScript(隐式依赖) |
62+
| **状态管理** | 原生 React Hooks(未显式引入 Redux) |
63+
| **UI 组件库** | Ant [email protected] +`@ant-design/[email protected]` |
64+
65+
#### **开发工具链**
66+
| 类别 | 技术栈 |
67+
| --------- | ------------------------------------------ |
68+
| **构建工具** | Vite@5(替代 Webpack) +`vite-plugin-react@4` |
69+
| **代码规范** | ESLint +`react-hooks`/`refresh`插件 |
70+
| **特殊集成** | `vite-plugin-svgr`(SVG 转 React 组件) |
71+
72+
#### **关键功能依赖**
73+
| 类别 | 技术栈 |
74+
| ------------- | ---------------------------------------------------------------------- |
75+
| **编辑器** | `[email protected]`(代码编辑器) +`@tinymce/[email protected]`(注释节点富文本编辑器) |
76+
| **HTTP 客户端** | `[email protected]`(API 请求) |
77+
| **核心依赖** | `@fit-elsa/elsa-core`(本地路径引用) |
78+
79+
## 快速开始
80+
81+
所需要的环境:
82+
83+
* 编辑器,如 WebStorm
84+
* node 推荐 v20.16.0
85+
86+
## 编译启动
87+
88+
```bash
89+
# 从根目录开始
90+
# 进入fit-elsa目录
91+
cd ./framework/elsa/fit-elsa
92+
93+
# 安装依赖
94+
npm i
95+
96+
# 编译构建
97+
npm run build
98+
99+
# 进入fit-elsa-react目录
100+
cd ../elsa-react
101+
102+
# 安装依赖
103+
npm i
104+
105+
# 编译构建
106+
npm run build
107+
108+
#启动 fit-elsa-react
109+
npm run dev
110+
```

0 commit comments

Comments
 (0)