vue自动将px转换成rem

1.安装lib-flexible

npm i lib-flexible --save

2.引入flexible

在项目入口文件main.js中添加如下代码，引入flexible

import 'lib-flexible'

3.安装px2rem-loader(将px转换成rem)

npm install px2rem-loader --save-dev

4.配置px2rem-loader

在vue-cli生成的文件中,找到以下文件 build/utils.js,如下图添加配置

const cssLoader = {
    loader: 'css-loader',
    options: {
      minimize:process.env.NODE_ENV ==='production',
      sourceMap: options.sourceMap,
      importLoaders:2
    }
  }
  const px2remLoader = {
    loader: "px2rem-loader",
    options: {
    remUnit: 75
    }
  }

5.去除index.html中mate标签(一定要注销) 配置适配各种机型

6.找到node_modules库（可要可不要）

找到flexible.js(适配ipad)

 function refreshRem(){
        var width = docEl.getBoundingClientRect().width;
        // if (width / dpr > 540) {
        //     width = width * dpr;
        //     alert(1)
        // }
        var rem = width / 10;
        docEl.style.fontSize = rem + 'px';
        flexible.rem = win.rem = rem;
    }