vue 中 px转vw的用法
2024-08-29 09:07:41
下面介绍最简单的用法
1 下载依赖
npm install postcss-import postcss-loader postcss-px-to-viewport --save-dev
2 在项目根目录下新建postcss.config.js,配置如下
module.exports = {
plugins: {
"autoprefixer": {
path: ['./src/*']
},
"postcss-import": {},
"postcss-px-to-viewport-opt": {
"viewportWidth": "", //视窗的宽度,对应的是我们设计稿的宽度
"viewportHeight": "", // 视窗的高度
"unitPrecision": , //指定`px`转换为视窗单位值的小数位数(很多时候无法整除)
"viewportUnit": "vw", //指定需要转换成的视窗单位,建议使用vw
"selectorBlackList": ['#nprogress'], //指定不转换为视窗单位的类
"minPixelValue": , // 小于或等于`1px`不转换为视窗单位
"mediaQuery": false, // 允许在媒体查询中转换`px`
// "exclude": /(\/|\\)(node_modules)(\/|\\)/
},
}
};
配置可以修改 ,参考https://github.com/evrone/postcss-px-to-viewport/blob/master/README_CN.md
最新文章
- touch的属性
- [每日电路图] 7、设计一个PCB的流程及细节·总结——给外行的同学或刚入行的同学一个宏观鸟瞰电路板设计的大致流程的文章
- MemSQL分布式架构介绍(一)
- 日志分析 第五章 安装logstash
- Java-->;Json解析网页数据
- CentOS7安装Cobbler
- JavaScript之this指针深入详解
- pre标签 首行会自动换行解决方案
- 通过Percona Xtrabackup实现数据的备份与恢复
- 图论中DFS与BFS的区别、用法、详解…
- 【Beta】Daily Scrum Meeting——Day3
- eclipese pyDEV安装----可以直接运行python文件
- linux 获取帮助的命令
- C# 交集、差集、并集、去重
- 深入理解【缺页中断】及FIFO、LRU、OPT这三种置换算法
- 算法学习——从bzoj2286开始的虚树学习生活
- 使用docker安装myql/redis等软件
- WinRAR 0day漏洞 附利用过程
- Kettle进行数据迁移(ETL)
- varnish/squid/nginx cache 有什么不同?