在项目中使用postcss-plugin-px2rem

//utils/rem.js
(function () {
  document.body.style.fontSize = '14px'
  const setRem = () => {
    let vw = document.documentElement.clientWidth
    document.documentElement.style.fontSize = vw / 7.5 + 'px'
  }
  setRem()
  window.onresize = setRem
}())

//.postcssrc.js
module.exports = {
  "plugins": {
    "postcss-import": {},
    "postcss-url": {},
    // to edit target browsers: use "browserslist" field in package.json
    "autoprefixer": {},
    "postcss-plugin-px2rem": {
      remUnit: 100,
      mediaQuery: true,
      exclude:"/node_modules/i",
      selectorBlackList: ['html', 'mint-', 'mt-', 'mpvue-', 'calendar', 'iconfont'], //在rem.js全局作用下   排除指定的文件的影响
      propBlackList: ['border']
    }
  }
}
image.png
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容