如何用Vux给Vue加料？如何用Q2 如何使用Vue Vux

如何用Vux给Vue加料？

一、给Vue穿件新衣——引入Vux库

首先，得让Vux知道你在Vue项目中，所以我们要把Vux请进来。

你可以用npm或yarn把这个库给安装上：

npm install vux --save

yarn add vux

二、Vux插件——配置到位

有了Vux还不够，得让它知道如何跟Webpack相处。

得在项目的Webpack配置文件里加几行代码：

{
  test: /\.vue$/,
  loader: 'vue-loader',
  options: {
    // ... 其他配置 ...
    postcss: [
      require('vux-postcss')
    ]
  }
}

别忘了，你还得告诉Vux你的组件在哪里：

import Vue from 'vue'
import { XHeader, Tabbar, TabItem } from 'vux'

Vue.component('x-header', XHeader)
Vue.component('tabbar', Tabbar)
Vue.component('tab-item', TabItem)

三、Vux组件——玩转UI

现在，Vux组件就可以在你的项目中自由使用了。

比如，用个按钮组件试试：