vue2.0移动端配置flexible.js

最新版vue-cli,配置手淘的lib-flexible.js和rem实现移动端页面自适应

1.安装flexible.js

cnpm install lib-flexible --save

2.main.js引入

import 'lib-flexible'

3.px转rem,首先我们来安装

cnpm install px2rem-loader --save-dev

4.配置px2rem-loader

首先找到 build/utils.js文件，在utils.js中添加如下配置

importLoaders:2

然后在generateLoaders函数里配置

const px2remLoader = {
 loader: 'px2rem-loader',
 options: {
  remUnit:75
 }
}

px2remLoader加到generateLoaders里面

5.到此完毕，重启项目

npm run dev

6.可以愉快的搞事情了

.asd{
    width:200px;
    height:200px;
    background:#ff7900;
}
渲染出来是这样的