lib-flexible 实现移动端自适应布局

465 阅读1分钟

安装

$ npm install lib-flexible

在入口文件中引入

import 'lib-flexible'; 

继续安装

$ npm install webpack-px2rem-loader

编写loader

const px2remLoader = {
    loader: 'webpack-px2rem-loader',
    options: {
        basePx: 37.5, //效果图大小
        min: 1, //最小尺寸
        floatWidth: 3 //转化rem后保留的小数位
    }
}

在样式相关的loader中加入,这里以vue-cil的配置为例

const loaders = options.usePostCSS ? [cssLoader, postcssLoader, px2remLoader] : [cssLoader, px2remLoader]