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

联合创作 · 2023-09-19

鲁班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
浏览 1
点赞
评论
收藏
分享

手机扫一扫分享

编辑
举报
评论
图片
表情
推荐
点赞
评论
收藏
分享

手机扫一扫分享

编辑
举报