vueApp引入mint-ui

全局引入

安装：
npm install mint-ui -S

在main.js:
import Mint from 'mint-ui'; Vue.use(Mint); // 引入全部组件
import 'mint-ui/lib/style.css'
Vue.use(MintUI)

按需加载

安装：
babel-plugin-component 是按需加载插件

npm install mint-ui -S
npm i babel-plugin-component -D

配置.babelrc文件：

"plugins": [
    "transform-vue-jsx",
    "transform-runtime",
    以下是新加的代码
    [
      "component",
      {
        "libraryName": "mint-ui",
        "style": true
      }
    ]
  ]

在main.js里需要什么引入什么：

import { Toast, MessageBox, Swipe, SwipeItem } from 'mint-ui'

Vue.prototype.$toast = Toast
Vue.prototype.$messagebox = MessageBox
Vue.component(Swipe.name, Swipe)
Vue.component(SwipeItem.name, SwipeItem)

注意

1. mint-ui里的Toast, MessageBox不是全局变量，在使用的pages里还得重新引入：
   import { Toast, massageBox } from 'mint-ui'
   或
2. 提供一个实例上的方法，通过 原型 调用:

在main.js:
Vue.prototype.$toast = Toast
Vue.prototype.$messagebox = MessageBox

全局使用：
this.$toast('手机号错误')
this.$messagebox (data.retMsg)

3. 按需加载使用swipe组件，要引入两个组件，Swipe和SwipeItem：

import { Swipe, SwipeItem } from 'mint-ui'