笔记-vue中使用rem,支持第三方UI
1.安装依赖
postcss-pxtorem 用于将单位转化为 rem
lib-flexible 用于设置 rem 基准值
2.修改package.json
"postcss": { "plugins": { "autoprefixer": { "browsers": [ "Android >= 4.0", "iOS >= 7" ] }, "postcss-pxtorem": { "rootValue": 50, "propList": [ "*" ] } } }
3.创建remConfig.js
export default function () { (function (doc, win) { var docEl = doc.documentElement, resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize', recalc = function () { var clientWidth = docEl.clientWidth if (!clientWidth) return docEl.style.fontSize = 100 * (clientWidth / 750) + 'px' } if (!doc.addEventListener) return win.addEventListener(resizeEvt, recalc, false) doc.addEventListener('DOMContentLoaded', recalc, false ) })(document, window) }
4.main.js 引入remConfig.js

浙公网安备 33010602011771号