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'