vue中的适配:px2rem
这应该是vue项目在适配移动端时候,最简单的方法之一
下面是基本步骤(使用cnpm)
1.下载并引入lib-flexible
cnpm install --save lib-flexible
在main.js中 :import ‘lib-flexible/flexible’
2.引入px2rem-loader
cnpm install --save px2rem-loader
3.将px2rem-loader添加到cssLoaders
在build/util.js中 添加如下配置
代码如下
const px2remLoader = { loader: 'px2rem-loader', options: { remUnit: 75//这个是重点,设计稿是750px } }
const loaders = [cssLoader,px2remLoader]
完了就可以直接用px做单位按照750的设计稿撸代码了,
原文地址:https://segmentfault.com/a/1190000017059317
相关推荐
-
CSS 中元素叠放顺序的规则细究 框架
2019-3-11
-
【开源】合摩 WeexBox 正式发布 框架
2018-12-20
-
可靠React组件设计的7个准则之封装 框架
2019-8-16
-
React diff原理探究以及应用实践 框架
2019-4-19
-
【源码拾遗】从vue-router看前端路由的两种实现 框架
2019-2-22
-
如何开发webpack loader 框架
2019-7-2
-
教你从写一个迷你koa-router到阅读koa-router源码 框架
2019-3-24
-
vue中 iview的upload上传图片 获取本地图片绝对路径 在前端实现图片预览 框架
2019-6-15
-
Angular 依赖注入 框架
2019-9-13
-
React Fiber 架构理解 框架
2019-3-31