百度360必应搜狗淘宝本站头条
linux文件压缩linux用户组查看linux磁盘mysql安装linuxlinux多线程
当前位置：网站首页 > 优雅编程 > 正文

开源精品 Vue 可视化在线H5搭建平台Gods-Pen

sinye56 2024-10-25 16:14 3 浏览 0 评论

前几天有分享一个vue大数据可视化模板。今天给大家介绍一款超优良的Vue可视化拖拽制作平台项目GodsPen。

基于Vue大数据可视化大屏模板

gods-pen 基于 vue2.x 构建的拖拽式H5在线网页制作平台，star高达3.1K+。支持自定义组件、添加脚本、数据统计及在线生成可管理和编辑的h5页面。

技术实现

  • vue + vuex + vue-router
  • element-ui 饿了么PC组件库
  • mint-ui 饿了么移动端组件库
  • cropperjs 一款强大的图片裁剪工具
  • monaco-editor 微软开源的基于Vscode代码编辑器
  • js-cookie 轻量级JS Cookie插件
  • axios 基于promise的HTTP库

安装使用

# 下载项目
git clone https://github.com/ymm-tech/gods-pen.git

# 进入目录
cd gods-pen

# 安装依赖包
yarn install

# 开发
npm start

# 编辑器构建
npm run editor:build

# 渲染器构建
npm run client:build

组件简单接入

如果第三方组件满足不了你，可以使用官方提供的脚手架创建组件，暴露参数给其他同学在编辑器填写即可。

https://godspen.ymm56.com/doc/develop/component.html

组件动画展示

使用了 Animate.css 提供的一套 CSS 动画。并提供逐帧设置预览，方便使用。

合成组件展示

合成组件就是选择已有的节点保存为一个通用的组件，方便下次直接使用。

官网提供了丰富的文档及操作说明。

截止2020年7月 已经支撑起满满4100多个活动页面，官方还在持续更新迭代，目前官网上所有的体验能力均免费开源，想要技术提升的同学不可错过哟！

# 官网地址
https://godspen.ymm56.com/

# 在线体验
https://godspen.ymm56.com/admin/#/home

# 组件商城
https://godspen.ymm56.com/shop/

# 仓库地址
https://github.com/ymm-tech/gods-pen

ok，就介绍到这里。希望这次分享能帮助到大家，感兴趣的同学可以去看下哈！

相关推荐

Linux在线安装JDK1.8

首先在服务器pingwww.baidu.com查看是否可以连网然后就可以在线下载一、下载安装JDK1.81、在下载安装的同时做好一些准备工作...

Linux安装JDK，超详细

1、了解RPMRPM是Red-HatPackageManager（RPM软件包管理器）的缩写，这一文件格式名称虽然打上了RedHat的标志，但是其原始设计理念是开放式的，现在包括OpenLinux...

Linux安装jdk1.8(超级详细)

前言最近刚购买了一台阿里云的服务器准备要搭建一个网站，正好将网站的一个完整搭建过程分享给大家！#一、下载jdk1.8首先我们需要去下载linux版本的jdk1.8安装包，我们有两种方式去下载安装...

Linux系统安装JDK教程

下载jdk-8u151-linux-x64.tar.gz下载地址：https://www.oracle.com/technetwork/java/javase/downloads/index.ht...

干货|JDK下载安装与环境变量配置图文教程「超详细」

1.JDK介绍1.1什么是JDK?SUN公司提供了一套Java开发环境，简称JDK(JavaDevelopmentKit)，它是整个Java的核心，其中包括Java编译器、Java运行工具、Jav...

Linux下安装jdk1.8

一、安装环境操作系统：CentOSLinuxrelease7.6.1810(Core)JDK版本：1.8二、安装步骤1.下载安装包...

Linux上安装JDK

以CentOS为例。检查是否已安装过jdk。yumlist--installed|grepjdk或者...

Linux系统的一些常用目录以及介绍

根目录（／）：“／”目录也称为根目录，位于Linux文件系统目录结构的顶层。在很多系统中，“／”目录是系统中的唯一分区。如果还有其他分区，必须挂载到“／”目录下某个位置。整个目录结构呈树形结构，因此也...

Linux系统目录结构

一、系统目录结构几乎所有的计算机操作系统都是使用目录结构组织文件。具体来说就是在一个目录中存放子目录和文件，而在子目录中又会进一步存放子目录和文件，以此类推形成一个树状的文件结构，由于其结构很像一棵树...

Linux文件查找

在Linux下通常find不很常用的，因为速度慢（find是直接查找硬盘），通常我们都是先使用whereis或者是locate来检查，如果真的找不到了，才以find来搜寻。为什么...

嵌入式linux基本操作之查找文件

对于很多初学者来说都习惯用windows操作系统，对于这个系统来说查找一个文件简直不在话下。而学习嵌入式开发行业之后，发现所用到的是嵌入式Linux操作系统，本想着跟windows类似，结果在操作的时...

linux系统查看软件安装目录的方法

linux系统下怎么查看软件安装的目录？方法1：whereis软件名以查询nginx为例子...

Linux下如何对目录中的文件进行统计

统计目录中的文件数量...

Linux常见文件目录管理命令

touch用于创建空白文件touch文件名称mkdir用于创建空白目录还可以通过参数-p创建递归的目录...

Linux常用查找文件方法总结

一、前言Linux系统提供了多种查找文件的命令，而且每种查找命令都具有其独特的优势，下面详细总结一下常用的几个Linux查找命令。二、which命令查找类型：二进制文件；...

取消回复欢迎 你 发表评论:

一周热门
最近发表
标签列表