引入依赖
npm install postcss-px-to-viewport -save
image.png
配置 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-"], // 指定不需要转换的类
添加全局样式消除img被插件的影响
img {
content: normal !important;
}
只回对style内的样式进行转换，行内样式没办法转换
