為什么需要:
根據(jù)提供的目標(biāo)瀏覽器的環(huán)境來(lái)扎唾,智能添加css前綴,js的polyfill墊片,來(lái)兼容舊版本瀏覽器南缓,而不是一股腦的添加胸遇。避免不必要的兼容代碼,以提高代碼的編譯質(zhì)量汉形。
共享使用browserslist的組件們:
組件名 | 功能 |
---|---|
Autoprefixer | postcss添加css前綴組件 |
bable-preset-env | 編譯預(yù)設(shè)環(huán)境 智能添加polyfill墊片代碼 |
eslint-plugin-compat | |
stylelint-no-unsupported-browser-features | |
postcss-normalize | |
等等... |
基礎(chǔ)語(yǔ)法: 只要package.json
配置了browserslist
對(duì)象,需要的組件將自動(dòng)匹配到并使用,也可以配置到具體的組件參數(shù)上
{// package.json
"browserslist": [ // 注意:是一個(gè)數(shù)組對(duì)象
"> 1%",
"last 2 versions"
] }
last 2 versions:CanIUse.com追蹤的IE最新版本為11,向后兼容兩個(gè)版本即為10纸镊、11
設(shè)置語(yǔ)法:通過(guò)瀏覽器過(guò)濾的思路實(shí)現(xiàn)
默認(rèn)是兼容所有最新版本
例子 | 說(shuō)明 |
---|---|
> 1% |
全球超過(guò)1%人使用的瀏覽器 |
> 5% in US |
指定國(guó)家使用率覆蓋 |
last 2 versions |
所有瀏覽器兼容到最后兩個(gè)版本根據(jù)CanIUse.com追蹤的版本 |
Firefox ESR |
火狐最新版本 |
Firefox > 20 |
指定瀏覽器的版本范圍 |
not ie <=8 |
方向排除部分版本 |
Firefox 12.1 |
指定瀏覽器的兼容到指定版本 |
unreleased versions |
所有瀏覽器的beta測(cè)試版本 |
unreleased Chrome versions |
指定瀏覽器的測(cè)試版本 |
since 2013 |
2013年之后發(fā)布的所有版本 |
篩選后查詢,驗(yàn)證:npx browserslist
打印出所有瀏覽器版本支出情況,
溫馨提示:文章只是個(gè)人理解概疆,歡迎糾正