工作流自动化引擎

基于AI的卡片式工作流自动化引擎,无需编码即可连接应用并自动化任务。

  • by blacknoir-code
  • TypeScript
  • 本地部署
  • 更新于
在 GitHub 查看 blacknoir-code/mcp-flow

使用说明

MCP浏览器-基于AI的工作流自动化

由人工智能驱动的基于卡的工作流自动化引擎。连接应用程序,无需编码即可自动化任务。

特性

  • 🎨 可视化工作流生成器 -用于创建工作流的拖放界面
  • 🤖 AI助手 -自然语言工作流生成与优化
  • 📊 执行监控 -具有详细日志的实时工作流执行
  • 🔌 整合管理 -连接和管理多个应用程序和服务
  • 📝 模板库 -预构建的工作流模板
  • 🎯 添加卡面板 -浏览、搜索和插入工作流卡
  • 📈 运行历史 -跟踪和分析工作流执行情况
  • ⚙️ 设置和配置 -综合设置面板

技术栈

  • 反应18+ 使用TypeScript
  • 维特 为了快速发展和建设
  • 顺风 CSS 用于造型
  • 反应流 用于工作流画布
  • 状态 用于国家管理
  • React路由器 用于导航

入门指南

先决条件

  • Node.js 18+或Bun
  • npm、yarn、pnpm或bun

安装

# Using bun (recommended)
bun install

# Or using npm
npm install

发展

# Using bun
bun run dev

# Or using npm
npm run dev

该应用程序将在 http://localhost:8080

构建

# Using bun
bun run build

# Or using npm
npm run build

部署

维塞尔

此项目已配置为Vercel部署:

  1. 将代码推送到GitHub
  2. 在Vercel中导入项目
  3. Vercel将自动检测Vite框架
  4. 部署!

这 vercel.json 文件包括:

  • 构建命令: bun run build
  • 输出目录: dist
  • SPA路由配置
  • 资产缓存标头

环境变量

对于自定义基准路径,请设置:

  • VITE_BASE_PATH -应用程序的基本路径(默认值: /)

项目结构

src/
├── components/       # React components
│   ├── addCard/     # Add Card Panel components
│   ├── ai-assistant/# AI Assistant components
│   ├── card-details/# Card detail drawer
│   ├── execution/   # Execution panel
│   ├── integrations/# Integration management
│   ├── mcp/         # MCP server management
│   ├── settings/    # Settings panel
│   ├── workflow/    # Workflow canvas
│   └── workflowRuns/# Run history
├── data/            # Mock data and samples
├── hooks/           # Custom React hooks
├── pages/           # Page components
├── stores/          # Zustand stores
└── utils/           # Utility functions

许可证

麻省理工学院