很多前端小伙伴在写页面尤其是移动端页面的时候，要求页面布局以及字体大小随屏幕宽度变化而随之按比例自适应【注：非响应式】，那么，在vue-cli脚手架中应该如何去实现呢？
1.安装flexible库 ://在项目库下运行：npm i lib-flexible --save-dev2.项目入口文件main.js中引入lib-flexible:
//main.js中：import 'lib-flexible'3.在项目index.html的head中配置meta：
4.安装px2rem-loader：
//在项目库下运行npm install px2rem-loader --save-dev5.配置px2rem编译器：
在build/utils.js中，将px2rem-loader添加到cssLoaders中：
//自适应字体配置const px2remLoader = { loader: 'px2rem-loader', options: { remUnit: 37.5 //设计稿的宽度 除以 10，现阶段一般设计稿的宽度都为750px。如果基于iPhone5设计则为32.0(320 / 10 = 32)
}
}// generate loader string to be used with extract text plugin
function generateLoaders (loader, loaderOptions) { const loaders = options.usePostCSS ? [cssLoader, postcssLoader, px2remLoader] : [cssLoader, px2remLoader]
}6.启动项目：npm run dev
作者：流眸Tel
链接：https://www.jianshu.com/p/37f09e2a7b11
