uniapp中实现px转rpx

问题

由于本人当前微信小程序项目的框架使用的是mpvue,该框架已不再维护,所以正在转uniapp框架。迁移中首先遇到的一个问题就是px转2倍的rpx问题,因为mpvue是自带px2rpx-loader这个插件的,而uniapp没有。uniapp官方开发工具HbuilderX中有插件,但我不想用他们的开发工具,所以选择了cli(脚手架)开发。那么用脚手架开发如何来解决这个问题呢?

方法

在网上搜索一番后,我选择用PostCSS的一个插件来解决这个问题。

插件:

postcss-pxtorpx-pro

安装:

npm install postcss-pxtorpx-pro --save-dev

然后找到postcss.config.js这个文件,将该插件添加进去即可:
在这里插入图片描述


版权声明:本文为weixin_43820866原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。