使用vant-ui的项目，如何使用rem布局

h5项目，首先考虑的是使用vant-ui框架，但是部分功能需要自定义样式，而且要考虑不同设备的显示情况，所以打算引入rem布局方式

1如果需要使用 rem 单位进行适配，推荐使用以下两个工具：

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

2amfe-flexible引入到项目里

// main.js
require('amfe-flexible/index')

3由于项目中已经使用了vant-ui，直接引入上面两个工具会不会出问题？

• 如果设计稿尺寸是375，直接用没什么问题
• 如果设计稿尺寸不是375，而是750，PostCSS配置时需要转换下，代码如下↓

css: {
  loaderOptions: {
    postcss: {
      plugins: [
        require('postcss-pxtorem')({ // 把px单位换算成rem单位
          rootValue:75, // vant官方使用的是37.5
          //selectorBlackList: ['van'], // 标签名van开头，不转换rem
          propList: ['*']
        })
      ]
    }
  }
}