1、在方法創(chuàng)建一個rem.js? 然后再main.js? 引用

? ?在項目中css 寫 會自動轉成rem ，（行內樣式不會生效）

// 引入vuex為F11全屏后左邊按鈕樣式做判斷;
import store from "../store/index.js"

// 設置 rem 函數(shù)
function setRem() {
    //  PC端
    console.log("非移動設備");
    // 基準大小
    let baseSize = 100;
    let baseHeight = 1080;
    let baseWidth = 1920;
    let basePc = baseSize / baseWidth; // 表示1920的設計圖,使用100PX的默認值
    let vW = window.innerWidth; // 當前窗口的寬度
    let vH = window.innerHeight; // 當前窗口的高度

    // // 非正常屏幕下的尺寸換算
    let dueH = (vW * baseHeight) / baseWidth;

    if (vH < dueH) {
        // 當前屏幕高度小于應有的屏幕高度，就需要根據(jù)當前屏幕高度重新計算屏幕寬度
        vW = (vH * baseWidth) / baseHeight;
    }
    let rem = vW * basePc; // 以默認比例值乘以當前窗口寬度,得到該寬度下的相應font-size值
    document.documentElement.style.fontSize = rem + "px";

    // 給vuex的getHeight設置屬性;
    if(vH > 930 && vH < 1000){
        // 非全屏;
        store.state.getHeight = "small";
    }else if(vH > 1000 && vH < 1100){
        // 全屏;
        store.state.getHeight = "big";
    }
}
// 初始化
setRem();
// 改變窗口大小時重新設置 rem
window.onresize = function () {
    setRem();
};

export default setRem

2? 、 在main 引用

import "./utils/rem.js";