vue2+vant2 使用rem进行浏览器适配

根据VANT官方说明，需要在项目中安装两个插件即可。

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

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

但是昨天在安装使用的时候，出了问题。提示错误，打开项目页面也是空白了。于是百度了下，发现网络上的文章都是抄袭。基本没有解决问题，经过一番折腾后发现是postcss这个插件的版本高了，目前如果不指定版本号安装基本都是安装的是6+以上版本。导致项目不能识别其标识错误！

需要指定其版本号进行安装，如5.1.1
npm i [email protected]

接着安装lib-flexible

安装完成后，在main.js中引入
import "amfe-flexible"

然后在项目的根目录下新建.postcss.js文件（网上很多人说在安装完插件后会自动生成，但是我这里没有。）
然后在其中写入：

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

重启服务，即可看到原本PX单位全部变成了rem单位了！

发现VUE安装完插件依赖后，导致项目无法启动或是启动后空白。基本都是插件的版本过高引起的，注意下！