面向小程序装修场景的可视化页面搭建引擎
用可视化设计器、结构化 Schema 和可扩展的 Vue UI Shell，构建可维护的页面装修后台。
| 我想要 | 前往 |
|---|---|
| 先看看设计器实际效果 | 打开 Playground |
| 把设计器集成到 Vue 应用 | 快速开始 |
| 理解 Schema、命令和包的边界 | 核心心智模型 |
| 接入业务物料、属性表单或容器组件 | 扩展设计器 |
| 查阅包的公开 API | API 参考 |
- 为页面装修而设计：围绕物料拖拽、属性配置、设备预览和页面结构编排构建，而不只是一个通用拖拽容器。
- Schema 驱动：页面结构与属性保存为稳定、可导入导出的 Schema；业务运行时负责解释并渲染页面。
- 写入可控：新增、移动、删除和属性更新统一经由命令系统，天然接入历史记录、事件通知和行为约束。
- 开箱即用，也能深度扩展：标准设计器组合了画布与配置表单；物料、字段、容器、设备框架和主题都可按业务替换。
安装设计器和默认主题：
pnpm add @dragcraft/designer @dragcraft/themes @dragcraft/fields-ant-design-vue ant-design-vue vue在 Vue 应用入口加载字段样式与 dragcraft 主题：
import 'ant-design-vue/dist/reset.css'
import '@dragcraft/themes'随后创建设计器实例并渲染 DcDesigner。完整的最小物料、组件映射和字段 adapter 示例见快速开始。
版本和下载量由 npm 动态提供。各包的职责、接入方式和 API 请查看文档参考。
| 能力 | 说明 |
|---|---|
| 可视化设计器 | 三栏工作台，支持物料面板、画布编辑、节点选择和属性配置。 |
| 页面结构编排 | 使用 Schema 和布局计划表达内容区、固定区域、浮层与外部容器子区域。 |
| 业务物料扩展 | 通过物料元数据和组件映射，将业务组件接入画布与配置面板。 |
| 表单与字段扩展 | 通过 Form Schema 配置属性面板，可使用 Ant Design Vue adapter 或自定义字段组件。 |
| 主题与设备预览 | 提供 Standard、Material 主题和可替换的设备外壳，也支持完整自定义工作台视觉。 |
| 页面生命周期 | 提供导入、导出与编辑事件；草稿、发布、权限和生产运行时由业务应用掌控。 |
pnpm install
pnpm dev欢迎通过 Issue 提交问题或建议。在提交变更前，请依次运行：
pnpm build
pnpm lint
pnpm typecheck