postcss-px-to-viewport，将px单位自动转换成viewport单位

本文主要是介绍postcss-px-to-viewport，将px单位自动转换成viewport单位，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

1. 安装

   npm install postcss-px-to-viewport --save-dev

2. 项目根目录下新增 postcss.config.js 文件
3. postcss.config.js文件内容

   module.exports = {plugins: {autoprefixer: {},'postcss-px-to-viewport': {viewportWidth: 1920, // 视窗的宽度，对应的是我们设计稿的宽度.viewportHeight: 1080, // 视窗的高度，对应的是我们设计稿的高度.(也可以不配置)unitPrecision: 5, // 保留几位小数，指定`px`转换为视窗单位值的小数位数（很多时候无法整除）viewportUnit: 'vw', // 指定需要转换成的视窗单位，建议使用vwselectorBlackList: ['tab-bar', 'tab-bar-item', 'shopping-cart-bottom-bar'], // 指定不需要转换的类minPixelValue: 1, // 小于或等于`1px`不转换为视窗单位.mediaQuery: false // 允许在媒体查询中转换`px`}}
   }

这篇关于postcss-px-to-viewport，将px单位自动转换成viewport单位的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---