简介
npm 包：vue-mb-ui 是一款 Vue.js 的 UI 组件库，它包含了常见的前端组件，例如按钮、输入框、表格、下拉选择框等，还有一些特殊的组件，如弹窗、轮播图等。
vue-mb-ui 使用简单，支持按需加载组件，灵活性强，使用它可以快速开发出高质量的 UI 界面。
安装
安装 vue-mb-ui 可以直接使用 npm 安装，命令如下：
npm install vue-mb-ui --save
安装完成后，在 main.js 文件中引入并注册组件：
import Vue from 'vue' import VueMBUI from 'vue-mb-ui' Vue.use(VueMBUI)
这样，我们就可以在项目中使用 vue-mb-ui 了。
使用
使用 vue-mb-ui 提供的组件非常简单，我们只需要在需要使用的组件中添加标签即可。
例如，使用一个 button 组件：
<template>
<div>
<mb-button>点击我</mb-button>
</div>
</template>vue-mb-ui 的组件都支持自定义样式，如果需要设置自定义样式，可以使用 scoped 样式。
例如，我们需要设置一个红色的 button 组件：
-- -------------------- ---- -------
----------
-----
---------- ---------------------------
------
-----------
------ -------
-------------- -
----------------- ----
-
--------按需加载
vue-mb-ui 支持按需加载组件，这样可以减小构建后的文件体积，提高页面加载速度。
首先，需要安装 babel-plugin-component 插件：
npm install babel-plugin-component --save-dev
然后，在 .babelrc 中添加配置：
-- -------------------- ---- -------
-
---------- -
-
------------
-
-------------- ------------
------------------- -----
-
-
-
-安装完成后，我们就可以按需加载组件了。例如，需要使用 mb-button 组件：
import { MbButton } from 'vue-mb-ui'
Vue.component(MbButton.name, MbButton)这样就可以只加载 mb-button 组件相关代码，而不会加载整个组件库的代码，提高页面的加载速度。
示例代码
下面是一个使用 vue-mb-ui 中的 mb-button 组件的示例代码：
-- -------------------- ---- -------
----------
-----
--------------------------
------
-----------
--------
------ - -------- - ---- -----------
------ ------- -
----------- -
--------
-
-
---------来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60056d1881e8991b448e6e5b