vue项目pxtorem适配移动端,再引入vantui,字体比较小的问题

1 引入px转rem插件

npm install postcss-pxtorem -S

2 配置postcss.config.js（如果没有autoprefixer，要先安装）

const autoprefixer = require('autoprefixer')
const pxtorem = require('postcss-pxtorem')

module.exports = ({ file }) => {
  let rootValue
  // vant 37.5 [link](https://github.com/youzan/vant/issues/1181)
  if (file && file.dirname && file.dirname.indexOf('vant') > -1) {
    rootValue = 37.5 // 针对vant ui 字体变小所有对vant下目录根据375来配置rem
  } else {
    rootValue = 75
  }
  return {
    plugins: [
      autoprefixer(),
      pxtorem({
        rootValue: rootValue,
        propList: ['*'],
        minPixelValue: 2
      })
    ]
  }
}

3 安装amfe-flexible 用于适配移动端

npm install amfe-flexible -S

4 在main.js里面引入flexible

import 'amfe-flexible/index.js'