鲁班 H5基于 Vue 的拖拽式 H5 生成工具

鲁班H5是基于Vue2.0开发的，通过拖拽的形式，生成页面的工具，类似易企秀、百度 H5 的一个可视化搭建系统

初心：希望能通过工程化的手段，大幅度提高简单H5页面的制作效率，提高工程师的幸福感，从这种需求频繁变更的简单任务中解脱出来

Screenshots

在线访问地址

Features

1. 编辑器    

   
   
   
   

   1. - [x] 参考线    

   
   

   2. - [x] 吸附线、组件对齐    

   
   

   3. - [x] 拖拽改变组件形状    

   
   

   4. - [x] 元素: 复制（画布）    

   
   

   5. - [x] 元素: 删除（画布）     

   
   

   6. - [x] 元素: 编辑（画布）    

   
   

   7. - [x] 页面：新增    

   
   

   8. - [x] 页面：复制    

   
   

   9. - [x] 页面：删除    

   
   

   10. - [x] 快速预览    

   
   

   11. - [x] 撤销、重做

   
   



2. 组件系统    

   
   
   
   

   1. - [x] 文字    

   
   

   2. - [x] 普通按钮    

   
   

   3. - [x] 表单按钮    

   
   

   4. - [x] 表单输入框    

   
   

   5. - [x] 普通图片    

   
   

   6. - [ ] 背景图    

   
   

   7. - [ ] 视频（Iframe形式）

   
   



3. 增强功能    

   
   
   
   

   1. - [ ] 上传 PSD，一键转换为 H5(已经调研，可以实现)    

   
   

   2. - [ ] 图片库    

   
   

   3. - [ ] 第三方无版权图片搜索    

   
   

   4. - [ ] 自定义脚本(已经调研，可以实现)

   
   



4. 后端 API    

   
   
   
   

   1. - [x] 创建、保存、更新作品    

   
   

   2. - [x] 表单数据收集    

   
   

   3. - [x] 表单数据展示    

   
   

   4. - [x] 在线预览    

   
   

   5. - [x] 二维码预览

   
   

技术栈（当前）

1. 前端：Vue.js


2. 后端：Strapi


3. 存储：Sqlite