在用vue写移动端的项目时会用到rem适配,而将px计算转换rem比较麻烦也不好修改,并且许多UI插件使用的单位仍然是px,这时我们可以使用 postcss-pxtorem 工具帮助我们自动转换。
以 vue-cli2.0 创建的项目为例:
1.在 src/assets/js/ 文件夹下创建 rem.js 文件,自定义 html 的 font-size 大小,例:
/* 移动端适配 */
;(function(doc, win, width){
var docEl = doc.documentElement;
var head = doc.getElementsByTagName("head")[0];
var hFirst = head.firstChild || head.firstElementChild;
var cssEl = doc.createElement('style');
//手机横屏,竖屏可在此处设置
var resizeEvt = 'orientationchange' in win ? 'orientationchange' : 'resize';