vue-cli3.x/4.x vant 移动端适配

1.安装 lib-flexible 插件 ,手淘的移动端适配方案
npm i lib-flexible --save
2.在main.js中引入

import 'lib-flexible'

3.安装 postcss-px2rem-exclude 插件,主要解决的是vant等第三方UI框架在750或其他尺寸设计稿样式变形问题

npm i postcss-px2rem-exclude --save

注意: 如果使用了 postcss-px2rem 先将改插件删除
4.创建 postcss.config.js 文件

module.exports = {
  plugins: {
    autoprefixer: {},
    'postcss-px2rem-exclude': {
      remUnit: 75,   //注意设计稿为750,则这为75,如果设计稿为375,则这为37.5
      exclude: /node_modules|folder_name/i
    }
  }
}

5.重新启动即可

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值