Gemini-mo-ui NPM

gemini-mo-ui介绍

基于vue2.0、element-ui的组件库

使用指南

npm安装

npm install gemini-mo-ui

版本升级

npm uninstall gemini-mo-ui
npm install gemini-mo-ui

快速上手

在 main.js 中添加以下内容：

import MOUI from 'gemini-mo-ui'
import 'gemini-mo-ui/lib/moui.css'

Vue.use(MOUI);

工具类使用

console.log(this.$StringUtil.generateUUID())

开发指南

gitee地址

https://gitee.com/dong_wen_mo/gemini-mo-ui.git

开发步骤

0.代码开发
1.修改package.json文件的version
2.更新readme
3.提交代码
4.npm run lib
5.npm publish

说明

定义组件时，使用以下四类，描述组件信息

标题	含义
Attributes	属性
Events	自定义事件
Methods	用户事件
Slots	插槽

升级日志

图标说明

图标	代码	说明
🎉	`:tada:`	组件初次提交
✨	`:sparkles:`	组件引入新特性
🐛	`:bug:`	修复bug
⚡	`:zap:`	优化逻辑
🎨	`:art:`	改进样式
📝	`:memo:`	撰写文档
♻	`:recycle:`	代码美化
💥	`:boom:`	引入重大变化（非兼容性更新）
🚩	`:triangular_flag_on_post:`	版本升级

版本号说明

组件库的版本号采用major.minor.patch的形式，具体含义如下：

名称	含义	变化说明
major	主版本号	通常意味着组件库发生了巨大变化，比如体系结构的重新设计，组件库的重新设计等等
minor	次版本号	通常反映一些较大的改动，例如新增一个组件，或某个组件产生巨大变化，或非兼容性更新
patch	修补版本号	修复漏洞、组件优化、或一些小的改动（从0开始计数）

v1.0.0

新组件

🎉 信息按钮（mo-info-btn）
🎉 斜角按钮（mo-angle-btn）
🎉 搜索按钮（mo-search-btn）
🎉 块容器（mo-block）
🎉 主要容器（mo-main）
🎉 全屏按钮（mo-full-screen）
🎉 复制按钮（mo-copy）
🎉 主要导航（mo-main-header、mo-main-nav-item、mo-main-nav-divider）
🎉 次要导航（mo-sub-header、mo-sub-nav-item、mo-sub-nav-divider）
🎉 边栏标题（mo-sidebar-header）
🎉 代码块（mo-code）
🎉 右键菜单（mo-contextmenu、mo-contextmenu-item）
🎉 多行输入框（mo-textarea）
🎉 可编辑表格（mo-edit-table）

工具类

🎉 字符串工具类 StringUtil

v1.0.1

🐛 修复了信息按钮禁用时，指针样式不变化的bug

v1.0.2

🐛 修复了信息按钮样式显示bug

v1.1.0

新组件

🎉 代码块容器（mo-block-code）

mo-main-nav-item

💥 将“主要导航”组件名，由（mo-main-nav）修改为（mo-main-header）
💥 删除 active 属性
✨ 新增 name 属性，用于高亮

mo-sub-nav-item

💥 删除 active 属性
✨ 新增 name 属性，用于高亮

mo-code

✨ 引入 highlight.js
✨ 新增 width 属性，用于设置宽度
✨ 新增 maxWidth 属性，用于设置最大宽度
✨ 新增 height 属性，用于设置高度
✨ 新增 maxHeight 属性，用于设置最大高度
✨ 新增 lang 属性，用于设置code语法

v1.2.0

新组件

🎉 主要容器（左右）（mo-main-lr）
🎉 描述信息（mo-text-dscr）

v1.2.1

mo-text-dscr

🐛 修复了文本超出容器不换行的bug

v1.3.0

新组件

🎉 输入框（mo-input）

v1.4.0

新工具类

🎉 字符处理（$StringUtil）
🎉 全屏处理（$ScreenUtil）
🎉 数字处理（$MathUtil）
🎉 日期处理（$DateUtil）

v1.4.1

$MathUtil

🐛 删除了日志打印

v1.4.2

mo-input

🎨 修改placeholder的颜色为 #c0c4cc

v1.4.3

mo-edit-table

🐛 修复了在某些情况下，空值属性不存在的bug
🎨 修改了焦点移入后的样式

v1.5.0

新组件

🎉 代码编辑器（mo-code-edit）

mo-table-edit

💥 将“可编辑表格”组件名，由（mo-edit-table）修改为（mo-table-edit）

v1.5.1

mo-code-edit

✨ 新增语法高亮 sql 、xml
✨ 新增主题 dreamweaver、chrome、chaos、solarized_light、tomorrow_night_eighties
🎨 修改了全屏时的样式
🎨 修改了滚动条的样式
✨ 修改了 lang 和 theme 的默认值
✨ 删除了 max-lines 属性