Vue项目自适应页面配置

开发项目需要自适应页面
我们可以在根目录创建utils文件夹，在文件夹创建rem.js文件

// 设置 rem 函数
(function () {
    function setRem () {
    // 1920 默认大小16px;每个元素px基础上/16
        const htmlWidth = document.documentElement.clientWidth || document.body.clientWidth
        document.documentElement.style.fontSize = htmlWidth * 16 / 1920 + 'px'
    }
    // 初始化
    setRem()
    window.addEventListener('resize', setRem, false)
})()

然后引入到main.js

import '@/utils/rem'