postcss-pxtorem 插件自动转换 rem 单位的配置

1.安装插件 npm install postcss-pxtorem --save

2.配置config.ts(由于之前用网上常用的require方法，有报错问题，我就这样写了)

postcss: {
      plugins: [
        postCssPxToRem({
          rootValue: 37.5, // 1rem的大小
          propList: ["*"], // 需要转换的属性，这里选择全部都进行转换
        }),
      ],
    },

 3.此时重启项目页面已经发生变化 再创建一个rem.js文件

// 基准大小
const baseSize = 37.5;
// 设置 rem 函数
function setRem() {
  // 当前页面宽度相对于 750 宽的缩放比例，可根据自己需要修改。
  const scale = document.documentElement.clientWidth / 750;
  // 设置页面根节点字体大小
  document.documentElement.style.fontSize =
    baseSize * Math.min(scale, 1) + "px";
}
// 初始化
setRem();
// 改变窗口大小时重新设置 rem
window.onresize = function () {
  setRem();
};

4.在main.js/ts中引入rem.js/ts文件

import "./assets/rem.ts";