介绍
Vue-Blu是基于Vuejs和Bulma开发的开源UI组件库。旨在为PC端的前端开发(特别是中后台产品)提供一个快速且灵活的解决方案。
Bulma是一个基于Flexbox的免费开源CSS框架，已有200,000多名开发人员使用；笔者曾经也介绍过这一款css框架，目前star数已突破38.9k，确实是一个非常受欢迎的纯css框架
项目地址
vue-bluhttps://github.com/chenz24/vue-blu
Bulmahttps://github.com/jgthms/bulma/
特性
基于 npm + webpack + babel 开发，支持 ES2015全面、灵活且强大的ui组件，API友好样式基于Bulma框架(Flexbox based)，布局简单、响应式可定制化安装
<code>$ npm install vue-blu --save
/<code>
快速开始
<code>import Vue from 'vue'
import VueBlu from 'vue-blu'
import 'vue-blu/dist/css/vue-blu.min.css'
Vue.use(VueBlu)/<code>
组件
Helper 帮助说明Vue-Blu的样式库采用了bulma —— 一套新兴的、基于Flexbox、现代化的纯css框架。我们并不主张过度'组件化'，像layout、button之类的元素，原生已经有了足够的表达力， 组件化之后反而会降低效率和灵活性
基于flexbox，强大的布局工具。
在一个带有层次的导航结构中标明当前页面的位置，并可返回上级
步骤条，常用于分步操作
选项卡切换，常用于内容的收纳和展现
警告提示，展现需要关注的信息。
从侧边滑出的模态框
可折叠展开的内容区域
模态对话框
全局的消息提示
对不同事物的属性或维度进行标记和分类的小标签
为当前工作流程和动作提供实时反馈
鼠标click/hover，弹出气泡似的浮层。类似popover，但可承载更多内容
简单的文字提示气泡框，常用于鼠标hover时
垂直按时间展示的信息流
列表展示结构化的数据，支持排序、分页、自定义操作等复杂行为
对于表单的样式和布局等展现方面的实现，我们认为原生的HTML元素加CSS足以满足，特别是有了Bulma。所以Blu的Form基本全部依赖于Bulma。对于某些功能性的表单组件如AutoComplete、Select， Blu会另有封装。
用在数字的输入场景中，可使用鼠标和键盘操作
日期时间选择器,基于轻量且强大的 flatpickr
总结
不论是从UI还是从功能，以及从组件丰富程度来看，Vue-Blu都是非常值得使用的一个Vue的组件，可以不必拘泥于市面上最常用的UI，偶尔换一下风格也是非常有必要的！enjoy IT！