1. 裝包

cnpm install postcss-pxtorem -D

2. 修改根目錄 .postcssrc.js 檔案

// https://github.com/michael-ciniawsky/postcss-load-config

module.exports = {
  "plugins": {
    "postcss-import": {},
    "postcss-url": {},
    // to edit target browsers: use "browserslist" field in package.json,
    "autoprefixer": {},
    "postcss-pxtorem": {
    "rootValue": 32,
    "propList": ["*"]
    }
  }
}
 

3. 引入rem.js

// 基準大小
const baseSize = 32
// 設定 rem 函式
function setRem () {
  // 當前頁面寬度相對於 750 寬的縮放比例，可根據自己需要修改。
  var scale = document.documentElement.clientWidth / 412
  // 設定頁面根節點字型大小
  document.documentElement.style.fontSize = (baseSize * Math.min(scale, 2)) + 'px'
}
// 初始化
setRem()
// 改變視窗大小時重新設定 rem
window.onresize = function () {
  setRem()
}