当前位置: 首页 > Web前端 > HTML

Browserslist

时间:2023-03-27 23:26:34 HTML

是一个极其重要的处理css/js兼容性的工具这篇webpack处理css资源文章中使用的工具browserslist对于兼容性处理非常重要!让我们在本文中详细讨论它。查询兼容性不同的浏览器可能对css/js属性有兼容性,可以通过网站caniuse查看。例如css中的user-select属性就是用来指定是否可以在浏览器上进行双击选择或者高亮显示。在ie6-9中不能使用,在ie10-11中需要加-ms-前缀。也就是说,为了多浏览器兼容处理,css代码可以这样写-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;在项目中,兼容的css或js代码可能不止一个,需要兼容的版本不能一一列举。这时候就需要借助工具来帮我们处理了~兼容性规则browserslist需要写一些浏览器兼容条件,告诉postcss和babel编译css和js代码有什么要求,才能兼容。常用的写法包括这些默认值:Browserslist的默认配置(>0.5%,last2versions,FirefoxESR,notdead)5%:通过全局统计选择的浏览器版本,可以使用>=,1%","last2version","notdead"]//.browserslistrc>1%,last2version,不是死编译过程,browserslist去哪里找浏览器使用率和更新时间?其实最后还是用了工具caniuse-lite来查询,在caniuse-tableBrowserusage中可以查询到。比如chromeforAndroid99的用户占比非常高,达到了37.21%。以上是browserslist,可以找到符合要求的浏览器版本和使用流程。更多关于webpack的内容可以参考我的其他博文,持续更新中~