h5ds 基于HTML5构建的web网页可视化制作器。
通过轻松拖拽元素即可快速天生精美的H5页面。

技能栈前端：React+Mobx+Less+jQuery后端：NodeJs+Ngnix+Mysql工具：Babel+Webpack+Gulp项目模块架构

html5网页设计技术超优良 H5可视化制造编纂器H5DS Angular

项目构造

安装

$ npm i h5ds -S快速利用

import React, { Component } from &#39;react'import H5dsEditor from 'h5ds/editor'import 'h5ds/editor/style.css'class Editor extends Component { constructor(props) { super(props); this.state = { data: null }; } / 保存app / saveApp = async data => { console.log('saveApp ->', data); }; / 发布app/ publishApp = async data => { console.log('publishApp ->', data); }; componentDidMount() { // 仿照异步加载，设置 defaultData 会默认加载一个初始化数据 setTimeout(() => { this.setState({ data: 'defaultData' }); }, 100); } / 利用编辑器 / render() { const { data } = this.state; return ( <H5dsEditor plugins={[]} // 第三方插件包 data={data} options={{ publishApp: this.publishApp, saveApp: this.saveApp, // 保存运用 appId: 'test_app_id' // 当前appId }} /> ); }}export default Editor;

h5ds编辑器通过韶光轴掌握动画进度。

动画效果利用的是如下CSS3动画库。

https://animate.style/

通过大略拖拽操作，就可实现h5代码编辑功能。

确实是非常棒的一款类似易企秀、MAKA的H5制作编辑工具，大家不要错过哟~~

# 官网地址https://www.h5ds.com/# 仓库地址https://github.com/h5ds/h5ds

ok，本日就分享到这里。
如果大家有其它精良的H5可视化编辑工具，欢迎互换谈论！