vue中如何按需引入vant

vue中如何按需引入vant

1.通过npm或者cnpm安装

npm i vant -S 或者 cnpm i vant -S

2.安装插件

npm i babel-plugin-import -D

3.然后在.babelrc.config.js 中添加配置 样式按需加载

{
  "plugins": [
    ["import", {
      "libraryName": "vant",
      "libraryDirectory": "es",
      "style": true
    }]
  ]
}

4.在src这个文件下面，创建一个plugins文件夹，里面创建一个vant.js文件，里面引入需要的组件，然后通过Vue.use引入到全局，

// 按需全局引入 vant组件
import Vue from 'vue'
import { Button, List, Cell, Tabbar, TabbarItem } from 'vant'
Vue.use(Button)
Vue.use(Cell)
Vue.use(List)
Vue.use(Tabbar).use(TabbarItem)

5.最后需要把这个js文件引入到app.js全局里面才生效，这样就可以使用啦