1.5使用 rem 适配

准备工作

• https://vant-contrib.gitee.io/vant/#/zh-CN/advanced-usage#rem-bu-ju-gua-pei

打开 vant 官网查看适配相关的文档说明

安装依赖

# 安装 postcss-pxtorem 相关依赖
pnpm install postcss postcss-pxtorem --save-dev

# 安装 lib-flexible
pnpm i -S amfe-flexible

修改 meta

# 修改 index.html
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">

引入依赖

# 修改 main.js
import "amfe-flexible"

添加相关配置文件

// postcss.config.cjs
module.exports = {
  plugins: {
    'postcss-pxtorem': {
      rootValue: 37.5,
      propList: ['*'],
    },
  },
};