1、新建一個項目,win+R打開命令行,輸入vue init webpack projectName進行項目搭建

2、安裝移動端vant插件,打開項目,在Teminal處通過npm install vant -S安裝vant組件;或者通過yarn add vant安裝移動端組件vant

3、引入組件; 自動按需引入組件npm install babel-plugin-import -D (推薦)

4、在package.json中查看插件是否已存在

5、在.babelrc 中添加配置

6、組件的使用1

7、組件的使用2

8、Vant是面向移動端的組件庫,若需在桌面端使用,則需要引入@vant/touch-emulator庫,自動將mouse事件轉換為touch事件


9、修改vant組件中原有樣式



結果:

