一款AI + 工作流驱动的跨平台低代码,拖拽式搭建,一套设计多端输出,让开发效率直接起飞!
猫拽低代码是一款基于 Vue3 + TypeScript + Vite 构建的跨平台低代码平台,集成了可视化设计器、工作流引擎、AI 智能辅助三大核心能力,让你通过拖拽就能快速搭建小程序、H5 和 APP 应用。
1. 可视化设计器
猫拽的设计器是一个功能完备的可视化拖拽编辑器,核心亮点:
- 拖拽式画布:从物料面板拖入组件,实时预览效果,选中、多选、对齐一气呵成
- iframe 沙箱渲染:画布在独立沙箱中运行,组件渲染环境与设计器互不干扰,保证预览效果真实可靠
- 插槽选择器:拖入容器组件时自动弹出插槽选择,精准控制子组件渲染位置
2. 工作流引擎
通过图形化节点连线,实现复杂业务逻辑:
- 10+ 内置节点:条件分支、循环体、跳出循环、云函数、HTTP 请求、物料事件……覆盖绝大多数业务场景
- 动态端口:条件分支和物料事件节点的端口数量不固定,根据配置自动生成,灵活应对多分支逻辑
- 异常处理:云函数和 HTTP 请求节点支持三种异常策略——中断执行、返回默认值、走异常分支,保障业务健壮性
- MCP 辅助:工作流画布同样支持 AI 辅助编辑,AI 帮你添加节点、连线、配置属性
3. 插件化架构
猫拽采用全插件化架构,所有设计器功能均以插件形式注册,当前内置 30+ 插件:
| 类别 | 插件 | 能力 |
|---|---|---|
| 配置编辑 | props、styles、tree、variable、datasource、script | 属性编辑、样式可视化、大纲树导航、变量管理、数据源配置、云函数编辑 |
| 物料资源 | materials、resource | 物料组件面板、图片/视频/音频/图标资源管理 |
| 结构编辑 | ast-schema、ast-workflow | 页面 DSL 直接编辑、工作流 Schema 直接编辑 |
| AI 能力 | robot | AI 智能助手,自然语言生成页面 |
4. 丰富物料库
内置组件库物料,覆盖 PC 端和移动端全场景:
- UniApp —— 原生小程序组件
- UniUI —— UniApp 扩展 UI 组件库
每个组件都有完整的元信息定义(属性、事件、插槽、默认值),拖入画布即可使用,属性面板自动生成配置表单。同时支持自定义物料扩展,满足个性化需求。
5. AI 智能辅助
猫拽集成了 AiMcp 智能辅助能力,支持通过自然语言描述需求生成页面。设计器画布和工作流画布均提供 MCP(Model Context Protocol)操作接口,AI 可以帮你:
- 添加/删除/修改物料节点
- 修改节点属性和样式
- Vue SFC 源码转 DSL
- 添加/删除工作流节点和连线
- 获取页面 Schema 和组件列表
6. 全端适配
一套设计同步输出:
- 小程序(微信小程序等 UniApp 跨端环境)
- H5(移动端网页)
- APP(通过 HBuilderX 云打包)
跨端渲染器(catpull-uni)包含自定义表达式解析器(兼容小程序沙箱限制)、节点处理器、上下文管理器,确保设计器产出的 DSL 在各端表现一致。
技术架构
猫拽采用 前端 pnpm Monorepo + 后端 Node.js 服务 架构,技术栈成熟可靠:
| 模块 | 技术栈 | 说明 |
|---|---|---|
| 设计器(catpull-designer) | Vue3 + Vite | 可视化拖拽编辑器主入口 |
| 跨端渲染器(catpull-uni) | UniApp + Vue3 | DSL 跨端运行时渲染 |
| 主服务器 | Express + Sequelize + TypeScript | API 接口、用户认证、项目管理 |
| 云函数服务 | Express + vm2 | 沙箱环境执行用户自定义代码 |
画布沙箱运行时:设计器画布在 iframe 中独立运行,加载 Vue、UniApp 等预构建运行时依赖,通过 postMessage 与主窗口通信,确保渲染环境隔离且真实。
开放能力
提供完整的公有云开放 API,支持第三方平台集成:
- AppKey 认证:通过
app_id+app_key密钥认证,安全可靠 - 项目管理:创建、删除、还原等
- 设计器接入:获取带 JWT 签名的设计器访问地址,直接嵌入你的平台
- 存储空间:查询 COS 存储使用情况
只需几行代码,就能把猫拽的可视化搭建能力嵌入到你的产品中!
为什么选择猫拽?
| 对比维度 | 传统开发 | 猫拽低代码 |
|---|---|---|
| 开发方式 | 手写代码 | 拖拽搭建 + 可视化配置 |
| 多端适配 | 每个端单独开发 | 一套设计多端输出 |
| 业务逻辑 | 编写复杂代码 | 工作流图形化编排 |
| 样式调整 | 改代码刷新看效果 | 可视化调整实时预览 |
| AI 辅助 | 无 | 自然语言生成页面 |
| 上手门槛 | 需要专业前端技能 | 拖拽即可,低门槛高上限 |
立即体验
官网:猫拽低代码平台