1、在项目根目录下中找到public文件夹,在public文件新建一个viewport.js,在viewport.js中写
(function (doc, win) {
var dpr = window.devicePixelRatio || 1
var docEl = doc.documentElement,
resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
recalc = function () {
var clientWidth = docEl.clientWidth
if (!clientWidth) return
// 当前页面宽度相对于1920宽的缩放比例,可根据自己需要修改。
// 屏幕1920x1080分辨率下40px=1rem
docEl.style.fontSize = 40 * (clientWidth / 1920) + 'px'
// 设置data-dpr属性,留作的css hack之用
docEl.setAttribute('data-dpr', dpr)
var delObj = document.getElementById('loading')
if(delObj){
$('#loading').remove()
}
}
recalc()
if (!doc.addEventListener) return
win.addEventListener(resizeEvt, recalc, false)
doc.addEventListener('DOMContentLoaded', recalc, false)
})(document, window)
2、在项目根目录下找到main.js,在main.js中引入viewport.js
import '/public/viewport.js'