1、确保你的项目是基于Vue CLI 4.5.0或更高版本创建的Vue 3项目。
2、安装Vant 4:
npm i vant@next -S
3、在项目中全局或局部引入Vant组件:
全局引入(main.js):
import { createApp } from 'vue'
import App from './App.vue'
import Vant from 'vant'
import 'vant/lib/index.css'
const app = createApp(App)
app.use(Vant)
app.mount('#app')
局部引入(组件内):
main.js:import 'vant/lib/index.css';
<script setup>
import { Button } from 'vant'
</script>
<template>
<Button type="primary">按钮</Button>
</template>
4、确保你的样式加载器(如css-loader
和style-loader
)能够处理Vant的CSS。
5、在组件中使用Vant的组件,并确保遵循Vant的使用规范。