vue+vant项目中 rem适配配置

vant rem适配,需要安装两个插件

  • postcss-pxtorem 是一款 postcss 插件,用于将单位转化为 rem  
  • lib-flexible 用于设置 rem 基准值

postcss-pxtorem:

npm install postcss-pxtorem --save-dev

lib-flexible:

npm i -S amfe-flexible

main.js 引入amfe-flexible

import 'amfe-flexible/index.js'

在postcss.config.js文件内(没有就在根目录创建一个)


module.exports = {
  plugins: {
    'autoprefixer': {
      overrideBrowserslist: [
        'Android 4.1',
        'iOS 7.1',
        'Chrome > 31',
        'ff > 31',
        'ie >= 8'
      ]
    },
    'postcss-pxtorem': {
      rootValue: 37.5,
      propList: ['*']
    }
  }
}


重启项目

 

 

你可能感兴趣的:(rem,vue.js,vant)