一、引入 Vant

vue2 引入：npm i vant@latest-v2

vue3 引入：npm i vant

二、在 main.js 中添加

import Vant(页面使用的变量名) from "vant(引入在 npm 中包的名字)" //引入包
import 'vant/lib/index.css'//引入样式
Vue.use(Vant)//挂载到全局 vue 中 

页面就可以直接使用。

使用 Vant 转换 rem

1、(vue2中)npm i postcss postcss-pxtorem --save-dev

2、npm i -S amfe-flexible

3、在 src 文件夹下添加 postcss.config.js 文件

module.exports = {
 plugins:{
   'postcss-pxtorem':{
      rootValue({file}){
        return file.indexOf('vant') !== -1 ? 37.5 :75;
      },
      propList:['*'],
   },
 },
};

4、在 main.js 中引入

import 'amfe-flexible'