a7650 / H5 Editor
Licence: mit
📕h5可视化编辑器，支持添加图片/文本/形状等，拥有图层/参考线/标尺/自动吸附对齐等功能
Stars: ✭ 224
Programming Languages
javascript
184084 projects - #8 most used programming language
Projects that are alternatives of or similar to H5 Editor
Vue Boilerplate Template
🍎 Efficient development of web SPA using Vue.js(2.*) + Webpack + Element-ui + Pwa + Vuex + Vuex-router + Vue-i18n + Dayjs + Lodash.
Stars: ✭ 461 (+105.8%)
Mutual labels: vuejs2, element-ui
el-table-draggable
让element-ui的table可拖动排序,支持 行，列，跨表格等特性
Stars: ✭ 68 (-69.64%)
Mutual labels: drag, element-ui
Nx Admin
👍 A magical 🐮 ⚔ vue admin，记得star
Stars: ✭ 2,497 (+1014.73%)
Mutual labels: vuejs2, element-ui
Vue Smooth Dnd
Vue wrapper components for smooth-dnd
Stars: ✭ 1,121 (+400.45%)
Mutual labels: drag, vuejs2
Vue Project
基于vue-cli构建的财务后台管理系统(vue2+vuex+axios+vue-router+element-ui+echarts+websocket+vue-i18n)
Stars: ✭ 301 (+34.38%)
Mutual labels: vuejs2, element-ui
Vue Data Board
A Data Analysis Board in Vue.
Stars: ✭ 1,046 (+366.96%)
Mutual labels: drag, element-ui
Vue Admin Manager
整合 vue,element,echarts,video,bootstrap(AdminLTE),admin等，搭建的后台管理系统
Stars: ✭ 153 (-31.7%)
Mutual labels: vuejs2, element-ui
Vue Element Starter
Vue starter with Element-UI [READY, unmaintained now]
Stars: ✭ 216 (-3.57%)
Mutual labels: vuejs2, element-ui
Vue Examples
Collection of Vue examples for beginner front end developers
Stars: ✭ 244 (+8.93%)
Mutual labels: vuejs2
Vue Element Loading
⏳ Loading inside a container or full screen for Vue.js
Stars: ✭ 234 (+4.46%)
Mutual labels: vuejs2
Vue Material Kit
Vue Material Kit - Open Source Material Design UI Kit
Stars: ✭ 231 (+3.13%)
Mutual labels: vuejs2
Vue2 Scrollbar
The Simplest Pretty Scroll Area Component with custom scrollbar for Vue 2. https://bosnaufal.github.io/vue2-scrollbar
Stars: ✭ 233 (+4.02%)
Mutual labels: vuejs2
Step Functions Draw.io
You can make a AWS step functions workflow with GUI and export/import JSON/YAML.
Stars: ✭ 231 (+3.13%)
Mutual labels: drag
Vue Product Zoomer
Zoom Prodct Image, useful for e-shop website
Stars: ✭ 248 (+10.71%)
Mutual labels: vuejs2
H5-Editor
可视化操作，拖拽生成页面，导出html文件
针对开发人员具有编辑器插件系统，支持和现有项目继承，支持二次开发
H5-Editor是一个纯前端项目，基于 Vue2 开发、通过拖拽生成页面，类似于 易企秀、百度 H5等
Demo
Usage
git clone https://github.com/a7650/h5-editor.git
cd h5-editor
#如果你已经安装了nodejs，vue-cli等环境，可直接执行下列命令，否则需先安装环境
npm install
npm run dev
技术栈
主要基于Vue2，Element-ui（少部分使用），Vuex
编辑器主要功能
- 元素自由拖拽，放大，缩小，旋转
- 可添加图片，文本，矩形，背景。多种编辑功能（字体，背景，大小，边距等）
- 组件自动吸附，实时参考线（组件可以和画布，自定义参考线以及其他组件进行自动吸附对齐，并显示实时参考线，拖动过程中按下alt键可暂时关闭）
- 标尺，参考线，可自定义参考线（在标尺上点击即可生成参开线，可拖动参考线更改位置，双击删除参考线）
- 撤销，重做（支持快捷键，可配置撤销的步数）
- 组件复制，粘贴，锁定，隐藏等
- ctrl + 拖动组件可快速复制组件
- 右键菜单，菜单可配置，可针对组件当前状态灵活生成（即不同的组件可产生不同的菜单）
- 图层面板，可拖拽更改组件图层，可重命名，可在图层面板快速锁定，删除，隐藏组件
- 同时选中多组件（按ctrl + 左键），可进行多组件对齐
- 数据备份，通过indexDB数据库保存在本地（可自动备份，手动备份），并可从备份中恢复数据
- 一键生成h5代码
- 编辑画布大小
- 多种快捷键
- 设置中心，可设置撤销功能，备份功能等
- 针对开发人员具有插件系统，可通过插件系统二次开发，可参考plugins目录下的pluginA
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].