vue使用vantUI框架字体适配字体过小问题

1.安装需要的依赖
amfe-flexible
postcss-pxtorem

npm install amfe-flexible --save
npm install postcss-pxtorem -D

2.main.js引入

import 'amfe-flexible'

3.postcss.config.js引入

rootValue值 根据你自己的图做适配，做判断主要是实现vant组件与自己css里的px保持一致

// module.exports = {
//     plugins: {
//       'autoprefixer': {
//         browsers: ['Android >= 4.0', 'iOS >= 8']
//       },
//       'postcss-pxtorem': {
//         rootValue: 37.5,
//         propList: ['*']
//       }
//     }
//   }

module.exports = ({ file }) => {
  let rootValue
  if (file && file.dirname && file.dirname.indexOf('vant') > -1) {
    rootValue = 36
  } else {
    rootValue = 36
  }
  return {
    plugins: {
      'autoprefixer': {
        browsers: ['Android >= 4.0', 'iOS >= 8']
      },
      'postcss-pxtorem': {
        rootValue: rootValue,
        propList: ['*']
      }
    }
  }
}