vue移动端适配

2019-08-08  本文已影响0人  辉夜真是太可爱啦

首先安装插件

npm install lib-flexible --save

main.js中进行引入

import 'lib-flexible'

然后安装px转换为rem的插件

npm install px2rem-loader --save

找到build文件夹下的utils.js,写入以下内容,remUnit的值请根据设计稿的宽度进行填写

image.png
  importLoaders: 2

  const px2remLoader = {
    loader: 'px2rem-loader',
    options: {
      remUnit: 192    //例如设计稿的宽度为1920px,那么就是写1920/10=192
    }
  };

找到generateLoaders函数,加入px2remLoader

image.png

然后重启项目,就可以看到效果了

写的是px 页面编译成rem
上一篇 下一篇

猜你喜欢

热点阅读