篇首语：本文由小编为大家整理，主要介绍了vue自动实现px转vw，使页面等比缩放适应大小屏幕相关的知识，希望对你有一定的参考价值。
为了小屏幕电脑兼容1920px设计稿的页面，所以需要将px单位转换成vw单位
一、安装插件
npm i postcss-px-to-viewport二、配置文件
在项目目录创建 .postcssrc.js 文件，并配置以下内容
module.exports = plugins: // 兼容浏览器，添加前缀 autoprefixer: overrideBrowserslist: [ "android 4.1", "ios 7.1", "Chrome > 31", "ff > 31", "ie >= 8", "last 10 versions", // 所有主流浏览器最近10版本用 ], // grid: true, , "postcss-px-to-viewport": viewportWidth: 1920, // 视窗的宽度，对应的是我们设计稿的宽度，一般是750 // viewportHeight: 1334, // 视窗的高度，根据750设备的宽度来指定，一般指定1334，也可以不配置 unitPrecision: 3, // 指定`px`转换为视窗单位值的小数位数 viewportUnit: "vw", //指定需要转换成的视窗单位，建议使用vw selectorBlackList: [".ignore", ".hairlines"], // 指定不转换为视窗单位的类，可以自定义，可以无限添加 minPixelValue: 12, // 小于或等于`1px`不转换为视窗单位，你也可以设置为你想要的值 mediaQuery: false, // 允许在媒体查询中转换`px` , ,;以上是关于vue自动实现px转vw，使页面等比缩放适应大小屏幕的主要内容，如果未能解决你的问题，请参考以下文章
