目前 Vant 官方提供了 Vue 2 版本、Vue 3 版本和微信小程序版本，并由社区团队维护 React 版本和支付宝小程序版本

Vue3使用Vant3
Vue2使用Vant2

Vue3安装

1
npm install vant --save

安装为Vant的最新版，与Vue3适配；而是vue2项目需指定版本号为v2，否则会出错

若出错需要卸载 npm uninstall vant ，重新安装

Vue2安装

@ 指定最新的版本号

1
npm i vant@latest-v2 -S

main引入

在main.js文件中
1、全局全部引入：

1
2
3
import Vant from 'vant';
import 'vant/lib/index.css';
Vue.use(Vant);

**2、*全局按需引入*：

  1. 在src目录创建plugins文件夹
  2. 文件夹中创建vant.js文件做引入操作，
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
import Vue from 'vue'
// 在这里引入你所需的组件
import {
    Button,
    Cell,
    CellGroup,
    Icon
    // 。。。
} from 'vant'

// 按需引入UI组件
Vue.use(Button)
Vue.use(Cell)
Vue.use(CellGroup)
Vue.use(Icon)
  1. 将这个文件在man.js内引入
1
2
3
4
5
6
7
8
9
10
import Vue from 'vue'
import App from './App.vue'
import '@/plugins/vant'

// 其他操作...

new Vue({
  router,
  render: h => h(App),
}).$mount('#app')