VUE postcss-px-to-viewport解决PC端适配


安装 postcss-px-to-viewport

npm install postcss-px-to-viewport -save  

  配置 package.json文件

  "postcss": {
    "plugins": {
      "autoprefixer": {},
      "postcss-px-to-viewport": {
        "viewportWidth": 1920, // 设计稿宽度
        "unitPrecision": 5, // px转换后的小数保留位数,有时候不能整除
        "minPixelValue": 1 // 小于或等于`1px`时不转换为视窗单位
      }
    }
  }

  其他配置可以自行查询如下列属性等:

     mediaQuery: false,   // 允许在媒体查询中转换,默认为false
    propList: ["*"],   // 转化为vw的属性列表
    viewportUnit: "vw",   // 指定转换的单位
    fontViewportUnit: "vw",   // 字体使用的单位
    selectorBlaskList: [".ignore-"],    // 指定不需要转换的类
  

  

 

 postcss-px-to-viewport的缺点

 postcss-px-to-viewport虽然好用,但是却有一个缺点,就是只对style内的样式进行转换,行内样式没办法转换,我还没解决,因为我没写行内样式


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM