项目架构 整体架构图
┌─────────────────┐ ┌─────────────────┐ ┌─────────────────┐
│ Photoshop │ │ Python后端 │ │ ComfyUI │
│ 插件层 │◄──►│ 服务层 │◄──►│ AI工具层 │
│ │ │ │ │ │
│ • UXP插件 │ │ • SocketIO服务 │ │ • 自定义节点 │
│ • React界面 │ │ • 实例管理 │ │ • 工作流执行 │
│ • 状态管理 │ │ • 数据存储 │ │ • 图像处理 │
└─────────────────┘ └─────────────────┘ └─────────────────┘
技术特点
- **主题适配**: 自动适配Photoshop的明暗主题
- **响应式设计**: 支持不同尺寸的插件面板
- **WebView集成**: 支持内嵌网页内容
- **权限管理**: 网络访问、代码生成、进程启动
技术栈总结
| 组件 | 技术栈 | 功能 |
|------|--------|------|
| Photoshop插件 | HTML/CSS/JS + React | 用户界面 |
| 前端构建 | TypeScript + React + Ant Design | UI组件 |
| 后端服务 | Python + SocketIO | 通信服务 |
| ComfyUI集成 | JavaScript | 节点扩展 |
| 构建工具 | ESBuild + TypeScript | 代码编译 |
| 状态管理 | Zustand + JSON Patch | 状态同步 |
| 通信协议 | WebSocket + SocketIO | 实时通信 |
| 测试框架 | Mocha + Chai | 质量保证 |