https://blog.csdn.net/m0_53538943/article/details/118568613

1、安裝 lib-flexible

npm install lib-flexible --save-dev

2、在main.js中引入lib-flexible

import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
// px2rem 自適應
import 'lib-flexible'

createApp(App).use(store).use(router).mount(
 
'#app')

3、更改 flexible.js 中的內容

檔案路徑 node_modules/lib-flexible/flexible.js
1
//更改之前
function refreshRem(){
        var width = docEl.getBoundingClientRect().width;
        if (width / dpr > 540) {
            width = 540 * dpr;
        }
        var rem = width / 10;
        docEl.style.fontSize = rem + 'px';
        flexible.rem = win.rem = rem;
    }

//更改之後
function refreshRem(){
        var width = docEl.getBoundingClientRect().width;
        if (width / dpr > 540) {
            width = width * dpr;
        }
        var rem = width / 10;
        docEl.style.fontSize = rem + 'px';
        flexible.rem = win.rem = rem;
    }

4、安裝 postcss-px2rem-exclude

npm install postcss-px2rem-exclude --save-dev

5、建立 postcss.config.js 並寫入（和src同級）

module.exports={
plugins:{
autoprefixer:{browsers:'last 5 version'},
'postcss-px2rem-exclude':{
remUnit:72, //設計稿寬度/10
exclude:/node_modules|folder_name/i
}
}
}