搭建一个 PC 版本的 ng-redux 项目 3 (兼容性)
利用 oldie 处理 IE 兼容性问题
oldie 是基于 PostCSS 的自动处理旧版本IE兼容性插件,利用它可以方便地处理一些兼容问题。
做手机项目久了,差点都忘记PC版本那几个经典的兼容处理了,最近因为有一个 PC 项目需求,刚好重温一下。当然在熟悉了npm和github之后这些问题社区有更好的解决方法。
PostCSS 是一个 css 后处理器,简单地说,他可以在你写完一个css规则之后,进行一定的转换。比如为兼容各种浏览器而增加前缀的著名插件Autoprefixer
,是PostCSS生态中一个著名的插件。同理,oldie也是,它允许你在编写一个标准的css规则之后,自动加上兼容IE的私有规则。
利用 webpack+PostCSS+oldie,我们要配置好 postcss,可选择直接安装postcss-loader
详细的就是postcss的内容,不细说。
我利用 oldie 一个最主要的功能是处理 opacity
,即兼容opacity:0.5
和filter: alpha(opacity=50)
,在postcss中配置如下
postcss:[
require('oldie')({
opacity:{
method:'copy'
}
}),
//... other options
]
就可以自动添加两条规则了。
话说回来,我并不喜欢兼容旧版本的浏览器,现在 ES7/CSS4/HTML5.1 的趋势一浪接一浪,旧的包袱早想丢掉了。但现实是骨感的,我们可以借助一些框架处理这些事情,自己只专注标准。
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论