vue移动端适配

在写移动端网页（H5页面）时，都少不了对页面的适配，目前主流的适配方案是rem单位适配。
但是如果直接使用js修改页面根节点的font-size，会导致很多第三方的框架无法使用，因为这些框架的单位都是px。然而这些框架都是不可或缺的。怎么办呢？
在vant ui官网中提供了解决方案，但是不详细，只介绍了方法，没有介绍具体的使用方法。
1、postcss-pxtorem 是一款 postcss 插件，用于将单位转化为 rem
2、lib-flexible 用于设置 rem 基准值
具体使用方法如下：
安装postcss-pxtorem：
npm命令安装：npm install postcss-pxtorem --save-dev
安装lib-flexible：
npm命令安装：npm i -S amfe-flexible
然后： main.js 引入amfe-flexible

import 'amfe-flexible/index.js'

然后修改.postcssrc.js配置

module.exports = {
    plugins: {
        "postcss-pxtorem": {
            rootValue: 37.5,
            propList: ["*"],
        },
    },
};

注意！！！！这个rootValue基准值，应该与设计图的宽度保持一致。（如果设计图宽度是750px，那么基准就是75，如果设计图宽度375，那么基准就是37.5）
But！！！ 如果有vant ui框架,基准必须设置37.5，否则vant元素大小都变了。如果设计图是750的，就去和设计互相伤害吧。

然后就可以愉快的使用设计图上的px单位尺寸了。