Vant使用方法

1.安装

// vue3版本
npm i vant //安装最新款

// vue2版本
npm i vant@2.12.47 //指定安装版本

2.引入组件（按需引入）
2.1安装插件

npm install babel - plugin - import -- save - dev
npm i babel-plugin-transform-runtime@6.23.0
npm i babel-plugin-transform-vue-jsx@3.7.0

2.2配置插件
在babel.config.js文件中配置文件

module.exports = {
    presets: [
        '@vue/cli-plugin-babel/preset'
    ],
    "plugins": [
        "transform-vue-jsx",
        "transform-runtime", ["import", { "libraryName": "vant", "style": true }]
    ]
}

2.3引入组件

import Vant from 'vant'
import 'vant/lib/index.css'
import { Button } from 'vant'
Vue.use(Button)
Vue.use(Vant)

2.4 使用组件

<van-button type = "primary" > 主要按钮 </van-button >
<van-button type = "info" > 主要按钮 </van-button >
<van-button type = "error" > 主要按钮 </van-button >