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


Posted in Javascript onNovember 20, 2019

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

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

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

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

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

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

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

5.重启项目就ok了

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jQuery ajax(复习)—Baidu ajax request分离版
Jan 24 Javascript
seajs学习之模块的依赖加载及模块API的导出
Oct 20 Javascript
Node.js读取文件内容示例
Mar 07 Javascript
javascript基本数据类型和转换
Mar 17 Javascript
浅析JS中的 map, filter, some, every, forEach, for in, for of 用法总结
Mar 29 Javascript
JS图片轮播与索引变色功能实例详解
Jul 06 Javascript
vue-video-player 通过自定义按钮组件实现全屏切换效果【推荐】
Aug 29 Javascript
Node.js Event Loop各阶段讲解
Mar 08 Javascript
jquery实现二级导航下拉菜单效果实例
May 14 jQuery
使用imba.io框架得到比 vue 快50倍的性能基准
Jun 17 Javascript
vue实现编辑器键盘抬起时内容跟随光标距顶位置向上滚动效果
May 28 Javascript
深入理解 ES6中的 Reflect用法
Jul 18 Javascript
vue3.0中使用postcss-pxtorem的具体方法
Nov 20 #Javascript
基于Vue+ElementUI的省市区地址选择通用组件
Nov 20 #Javascript
解决node.js含有%百分号时发送get请求时浏览器地址自动编码的问题
Nov 20 #Javascript
Node.JS发送http请求批量检查文件中的网页地址、服务是否有效可用
Nov 20 #Javascript
详解Nuxt.js 实战集锦
Nov 19 #Javascript
javascript的delete运算符知识点总结
Nov 19 #Javascript
100行代码实现vue表单校验功能(小白自编)
Nov 19 #Javascript
You might like
新版mysql+apache+php Linux安装指南
2006/10/09 PHP
PHP源码之 ext/mysql扩展部分
2009/07/17 PHP
DWR Ext 加载数据
2009/03/22 Javascript
在IE和VB中支持png图片透明效果的实现方法(vb源码打包)
2011/04/01 Javascript
JS实现淘宝幻灯片效果的实现方法
2013/03/22 Javascript
javascript按位非运算符的使用方法
2013/11/14 Javascript
多选列表框动态添加,移动,删除,全选等操作的简单实例
2014/01/13 Javascript
jQuery实现的Div窗口震动效果实例
2015/08/07 Javascript
javascript js 操作数组 增删改查的简单实现
2016/06/20 Javascript
在localStorage中存储对象数组并读取的方法
2016/09/24 Javascript
jQuery中checkbox反复调用attr('checked', true/false)只有第一次生效的解决方法
2016/11/16 Javascript
NodeJS测试框架mocha入门教程
2017/03/28 NodeJs
微信小程序多张图片上传功能
2017/06/07 Javascript
详解webpack3编译兼容IE8的正确姿势
2017/12/21 Javascript
Vue中父子组件的值传递与方法传递
2020/09/28 Javascript
关于Python元祖,列表,字典,集合的比较
2017/01/06 Python
python机器学习之神经网络实现
2018/10/13 Python
使用PyCharm创建Django项目及基本配置详解
2018/10/24 Python
Python函数参数匹配模型通用规则keyword-only参数详解
2019/06/10 Python
Django model select的多种用法详解
2019/07/16 Python
django的autoreload机制实现
2020/06/03 Python
Python异常处理机制结构实例解析
2020/07/23 Python
意大利自行车商店:Cingolani Bike Shop
2019/09/03 全球购物
斯图尔特·韦茨曼鞋加拿大官网:Stuart Weitzman加拿大
2019/10/13 全球购物
科室工作的个人自我评价
2013/10/30 职场文书
2013年保送生自荐信格式
2013/11/20 职场文书
财务出纳员岗位职责
2013/11/26 职场文书
2014年党的群众路线教育实践活动总结
2014/04/25 职场文书
一分钟演讲稿
2014/04/30 职场文书
个人授权委托书范本
2014/09/14 职场文书
三严三实学习心得体会(精选N篇)
2016/01/05 职场文书
2017寒假社会实践心得体会范文
2016/01/14 职场文书
《悬崖边的树》读后感2篇
2019/12/02 职场文书
如何用JavaScipt测网速
2021/05/09 Javascript
解决Vue+SpringBoot+Shiro跨域问题
2021/06/09 Vue.js
十大最强电系宝可梦,阿尔宙斯电系之一,第七被称为雷神
2022/03/18 日漫