一篇关于vue如何利用postcss-pxtorem进行移动端适配的问题

晨曦的阳光淌进窗户,给你送出我的祝福,打开手机查看,温馨,一点点爬上你的笑脸,你是快乐的,我就是幸福的,早安!

刚开始我按照网上的一些方式利用postcss-pxtorem方式去适配的时候怎么样都不成功,后来经过自己不断尝试之后终于成功了。稍微坐下总结:

1.个人建议在进行postcss-pxtorem适配的时候利用webpack进行项目配置,而不要用webpack-simple,因为webpack里面很多插件加载器之类的都是给你预配好的,这样在项目构建中就不会遗漏什么。

2.cnpm install postcss-pxtorem -D安装postcss-pxtorem,此插件如果你用的是webpack的话只要进行安装即可,不需要另外进行配置,此插件是对px进行转换。

3.新建一个rem.js的文件,输入以下代码即可,然后在main.js中引用。


4.在项目的根目录下找到.postcssrc.js文件在文件内添加以下代码,一般750px的设计稿的根元素大小设置32.


5.重启项目就ok了

到此这篇关于一篇关于vue如何利用postcss-pxtorem进行移动端适配的问题就介绍到这了。世间的捷径只有一条——正道!更多相关一篇关于vue如何利用postcss-pxtorem进行移动端适配的问题内容请查看相关栏目,小编编辑不易,再次感谢大家的支持!

您可能有感兴趣的文章
一篇关于el-table-column的formatter的如何使用及说明

一篇关于ElementUI的el-upload组件二次封装的问题

一篇关于vue组件事件属性穿透详解

一篇关于vue.javascript中如何实现方法内某些代码延时执行

一篇关于引入vue.javascript 文件的知识点总结