[论坛/社区](https://github.com/ly525/luban-h5/discussions) || [中文文档-推荐(语雀)](https://www.yuque.com/luban-h5/docs) || [📖中文在线文档(github.io)](https://ly525.github.io/luban-h5/zh/) | [📖English Docs](https://ly525.github.io/luban-h5/en/getting-started/introduction.html) | [README(en)](./README.en.md) || [Community/Discussions](https://github.com/ly525/luban-h5/discussions)
<h2 align="center">
鲁班 H5
</h2>
<p align="center">
可视化搭建,拖拽生成移动端页面
</p>
<p align="center">
Mobile Page Builder&Generator with Drag&Drop
</p>
[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com)
[![Docs](https://github.com/ly525/luban-h5/workflows/docs/badge.svg)](https://ly525.github.io/luban-h5/)
[![Release](https://img.shields.io/github/v/release/ly525/luban-h5)](https://github.com/ly525/luban-h5/workflows/docs)
[![Gitter](https://img.shields.io/gitter/room/luban-h5/community)](https://gitter.im/luban-h5/community)
[![GitHub issues](https://img.shields.io/github/issues/ly525/luban-h5)](https://github.com/ly525/luban-h5/issues)
[![GitHub stars](https://img.shields.io/github/stars/ly525/luban-h5.svg?style=social&label=Star&maxAge=2592000)](https://GitHub.com/ly525/luban-h5/stargazers/)
[![码云](https://img.shields.io/badge/Gitee--yellow.svg?style=social&logo=data:image/svg+xml;base64,PHN2ZyB0PSIxNTc0ODM3MTM4ODM3IiBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHAtaWQ9IjE3NzAiICAgICB3aWR0aD0iMTYiIGhlaWdodD0iMTYiPiAgICA8cGF0aCBkPSJNODkxIDQyOC44SDQ2NS44Yy0yMC40IDAtMzcgMTYuNS0zNyAzN3Y5Mi40YzAgMjAuNCAxNi41IDM3IDM3IDM3aDI1OC45YzIwLjQgMCAzNyAxNi42IDM3IDM3djE4LjRjMCA2MS4zLTQ5LjcgMTEwLjktMTEwLjkgMTEwLjlIMjk5LjRjLTIwLjQgMC0zNy0xNi42LTM3LTM3VjM3My4yYzAtNjEuMyA0OS43LTExMC45IDExMC45LTExMC45aDUxNy42YzIwLjQgMCAzNy0xNi41IDM3LTM3bDAuMS05Mi4zYzAtMjAuNC0xNi41LTM3LTM3LTM3SDM3My4zQzIyMC4yIDk2IDk2IDIyMC4yIDk2IDM3My4zVjg5MWMwIDIwLjQgMTYuNiAzNyAzNyAzN2g1NDUuNEM4MTYuMiA5MjggOTI4IDgxNi4zIDkyOCA2NzguNFY0NjUuOGMwLTIwLjQtMTYuNi0zNy0zNy0zN3oiICAgICAgICAgIGZpbGw9IiNkODFlMDYiIHAtaWQ9IjE3NzEiPjwvcGF0aD48L3N2Zz4=)](https://gitee.com/ly525/luban-h5.git)
目录
- [鲁班H5是什么?](#%E9%B2%81%E7%8F%ADh5%E6%98%AF%E4%BB%80%E4%B9%88)
- [Demo](#Demo)
- [Features](#features)
- [快速开始](#%E5%BF%AB%E9%80%9F%E5%BC%80%E5%A7%8B)
- [更多说明](#%E6%9B%B4%E5%A4%9A%E8%AF%B4%E6%98%8E)
* [前端组件说明](#%E5%89%8D%E7%AB%AF%E7%BB%84%E4%BB%B6%E8%AF%B4%E6%98%8E)
* [技术栈(当前)](#%E6%8A%80%E6%9C%AF%E6%A0%88%E5%BD%93%E5%89%8D)
- [👨🏻💻👩🏻💻交流群](#%E4%BA%A4%E6%B5%81%E7%BE%A4)
### 鲁班H5是什么?
1. 鲁班H5是基于Vue2.0开发、通过拖拽快速生成页面的平台
2. 类似 [易企秀](http://www.eqxiu.com/)、[Maka](http://maka.im/)、[百度 H5](https://h5.baidu.com) 等平台
### Demo
> [在线访问地址](https://h5.luban-h5.com)
<img src="https://s2.ax1x.com/2019/10/11/u7WzUx.gif" style="margin: 10px;" width="60%" />
### 🔗Links/相关链接
| 源码 | 文档 | 教程 | 社区 |
| ------ | -------- | ------ | ------ |
| [GitHub](https://github.com/ly525/luban-h5) | [中文文档](https://ly525.github.io/luban-h5/zh/) | [视频-快速开始(哔哩哔哩)](https://space.bilibili.com/121039466/channel/detail?cid=94066) | [论坛/社区(官方推荐)](https://github.com/ly525/luban-h5/discussions)
| [Gitee (国内镜像)](https://gitee.com/ly525/luban-h5) | [English Docs](https://ly525.github.io/luban-h5/en/getting-started/introduction.html) | 自定义组件教程(WIP) | [Gitter](https://gitter.im/luban-h5/community) |
| | [README(En)](./README.en.md) | [核心实现原理](https://juejin.im/post/5d6df27a6fb9a06b2d77eef9) | [中文社区/论坛(腾讯吐个槽)](https://support.qq.com/product/93432) |
### 🔗生态
| 后端集成 | 官方组件库 | 支撑/辅助组件 | 自定义组件 | RoadMap |
|------------------------------------------------------------------------------------------------|-----------------------------------------------------------|----------------------------------------------------|-------------------------------------------------------------------|------------------------------------------------------------|
| [Strapi.js (官方后端API)](/luban-h5/tree/dev/back-end/h5-api) | [轮播图](https://github.com/luban-h5-components/lbp-slide) | 图片库 | [自定义组件开发脚手架](https://github.com/luban-h5/vue-cli-plugin-lbhc) | [RoadMap/开发计划](https://github.com/ly525/luban-h5/projects) |
| [SpringBoot2-JPA](https://github.com/luban-h5/spring-boot-api-for-editor) | [普通按钮](https://github.com/luban-h5-components/lbc-button) | [文本对齐](https://github.com/luban-h5/lbs-text-align) | [自定义组件开发教程](https://github.com/luban-h5/vue-cli-plugin-lbhc/wiki) | |
| [SpringBoot2-Mybatis-plus](https://github.com/luban-h5/springboot2-mybatis-plus-api-for-luban) | | | 视频教程(WIP) | |
## 快速体验
> 以下方式,任选其中一种即可
#### 一、一键脚本(推荐!)
```bash
git clone https://github.com/ly525/luban-h5 && cd luban-h5
# 安装依赖,构建前后端(安装依赖会耗时略长,请耐心等待)
./luban-h5.sh init
# 启动项目访问 http://localhost:1337 即可
./luban-h5.sh start
# ./luban-h5.sh stop
```
#### 二、本地安装了 Node、Yarn
```bash
git clone https://github.com/ly525/luban-h5
cd luban-h5 # 项目根目录
# 后端
cd back-end/h5-api && yarn && yarn dev
# 前端
# 新开一个终端,在项目根目录执行如下命令
cd front-end/h5 && yarn && yarn build:engine && yarn dev
# 启动项目访问 http://localhost:1337 即可
```
- 更多细节,请参照 [鲁班H5-在线文档](https://ly525.github.io/luban-h5/zh/) 的 [`快速开始`](https://ly525.github.io/luban-h5/zh/getting-started/quick-start.html) 章节,进行配置即可
- 如果遇到接口 403 问题,请参照 [`快速开始`](https://ly525.github.io/luban-h5/zh/getting-started/quick-start.html) 章节,搜索关键字:403 即可
### 交流群
| 钉钉群 | 微信公众号 | 微信 |
|---|---|---|
| <img src="https://user-images.githubusercontent.com/12668546/90198376-157d7380-de04-11ea-8fb6-b53d33050741.png" width="100" />| <img src="https://user-images.githubusercontent.com/12668546/65471913-ab827580-dea3-11e9-919c-870c9605c60f.png" width="100" /> | <img src="https://user-images.githubusercontent.com/12668546/66585418-5cce1e80-ebb9-11e9-91c0-56f658f09e27.png" width="100" /> <br />请备注:鲁班H5交流|
## 更多细节请阅读[在线文档](https://ly525.github.io/luban-h5)
### Features
1. 编辑器
- [x] 参考线
- [x] 吸附线、组件对齐
- [x] 拖拽改变组件形状
- [x] 元素: 复制(画布)
- [x] 元素: 删除(画布)
- [x] 元素: 编辑(画布)
- [x] 页面:新增
- [x] 页面:复制
- [x] 页面:删除
- [x] 快速预览
- [x] 撤销、重做
2. 组件系统
- [x] 文字
- [x] 普通按钮
- [x] 表单按钮
- [x] 表单输入框
- [x] 普通图片
- [x] 背景图
- [x] 背景音乐
- [x] 视频(Iframe形式)
3. 增强功能
- [ ] 上�
没有合适的资源?快使用搜索试试~ 我知道了~
鲁班H5页面生成工具源码现在
共340个文件
js:138个
json:57个
md:48个
需积分: 13 2 下载量 114 浏览量
2023-03-21
17:14:54
上传
评论 1
收藏 1.09MB ZIP 举报
温馨提示
Vue2.0开发的,经过拖拽的方式,生成页面的工具,相似易企秀、百度H5等工具。 鲁班H5特征: 1、编辑器 参考线 吸附线、组件对齐 拽改动组件外形 元素: 复制(画布) 元素: 删除(画布) 元素: 编辑(画布) 页面:新增 页面:复制 页面:删除 快速预览 撤销、重做 2、组件系统 文字 普通按钮 表单按钮 表单输入框 普通图片 背景图 背景音乐 视频(Iframe方式) 3、加强功用 上传PSD,一键转换为H5(曾经调研,能够完成) 图片库 第三方无版权图片搜索 自定义脚本(曾经调研,能够完成) 4、后端API 创立、保管、更新作品 表单数据搜集 表单数据展现 在线预览
资源推荐
资源详情
资源评论
收起资源包目录
鲁班H5页面生成工具源码现在 (340个子文件)
.browserslistrc 21B
api.luban-h5.conf 401B
animate.min.css 57KB
swiper.min.css 19KB
.editorconfig 249B
.editorconfig 121B
.editorconfig 121B
engine.ejs 8KB
core-editor.ejs 439B
engine-example.ejs 230B
.eslintignore 32B
.eslintrc 541B
.gitignore 1KB
.gitignore 1KB
.gitignore 1KB
.gitignore 258B
.gitkeep 0B
.gitkeep 0B
.gitkeep 0B
index.html 49KB
index.html 4KB
使用说明.html 3KB
使用说明.html 3KB
index.html 2KB
favicon.ico 14KB
favicon.ico 14KB
favicon.ico 14KB
favicon.ico 1KB
swiper.min.js 125KB
vue.js 92KB
edit.js 11KB
animation.js 10KB
work.js 9KB
props.js 8KB
work.js 8KB
animation.js 7KB
chart-model.js 7KB
index.js 7KB
element.js 6KB
config.js 6KB
shape.js 6KB
swiper-animation.umd.min.js 5KB
http.js 5KB
index.js 5KB
lbp-text.js 4KB
contexmenu.js 4KB
Work.js 4KB
drag.js 4KB
lbp-table.js 4KB
engine-entry.js 4KB
action-menu.js 4KB
element.js 3KB
gallery.js 3KB
lbp-form-radio-group.js 3KB
excel-parser.js 3KB
lbp-form-checkbox-group.js 3KB
zh-CN.js 3KB
gallery.js 3KB
chart-mixin.js 3KB
pixabay.js 3KB
lbp-qq-map__editor.js 3KB
en-US.js 3KB
lbp-video.js 2KB
personal.js 2KB
vue.config.js 2KB
lbp-slide__editor.js 2KB
lbp-background.js 2KB
excel.js 2KB
index.js 2KB
lbp-form-button.js 2KB
index.js 2KB
lbp-form-input.js 2KB
index.js 2KB
links.js 2KB
index.js 2KB
line.js 2KB
flightplan.example.js 2KB
lbp-form-radio.js 2KB
csv-import.js 2KB
personal.js 2KB
animation.js 2KB
element.js 2KB
canvas-helper.js 2KB
index.js 2KB
lbp-news-list.js 2KB
index.js 2KB
flexible.js 2KB
script.js 2KB
card-cover.js 2KB
page.js 2KB
lbp-notice-bar.js 2KB
lbp-slide.js 2KB
dom-helper.js 2KB
lbp-bg-music.js 2KB
lbp-rate.js 2KB
Workform.js 2KB
options.js 2KB
Work.js 2KB
index.js 2KB
work.js 1KB
共 340 条
- 1
- 2
- 3
- 4
资源评论
网创学长
- 粉丝: 585
- 资源: 914
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
最新资源
- STM32单片机FPGA毕设电路原理论文报告一种基于st62单片机的称重显示控制器
- STM32单片机FPGA毕设电路原理论文报告一种基于SPCE061A单片机的信号发生器
- Ruby菜鸟入门指南.md
- STM32单片机FPGA毕设电路原理论文报告一种基于PIC系列单片机的SPWM逆变电源
- exp01A.cpp
- Rust语言学习万字指南!.md
- STM32单片机FPGA毕设电路原理论文报告一种基于msp430单片机的心电模块设计
- STM32单片机FPGA毕设电路原理论文报告一种基于MSP430单片机的日程管理系统
- web-screen-capture.jar
- 2024最新计算机二级真题练习题库含答案.md
资源上传下载、课程学习等过程中有任何疑问或建议,欢迎提出宝贵意见哦~我们会及时处理!
点击此处反馈
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功