Vue移动端适配

一、配置flexible
1、安装lib-flexible

npm install lib-flexible --save

2、全局引用文件（在mian.js中引入）

import 'lib-flexible/flexible'

3、在项目根目录index.html中添加meta标签

二、配置px2rem-loader
1、安装px2rem-loader

npm install px2rem-loader --save

2、（1）在build/utils.js文件配置px2rem-loader，（2）在generateLoaders方法中添加px2remLoader

image.png

  const px2remLoader = {
    loader: 'px2rem-loader',
    options: {
      // 使用第三方UI库的时候可能会出现UI插件缩小的情况，此时可以将75改成37.5
      remUnit: 75
    }
  }

修改配置后重启项目，项目中直接使用px单位