package.json 中的 `browserslist` 属性说明

在 package.json 中有一个 browserlist 属性，这个属性的作用是用来指定项目所适配的浏览器，这样一些前端工具就会根据适配的浏览器来查询其是否支持某项功能，从而正确的生成目标代码。

例如如下配置：

"browserslist": [
    "Chrome 98"
]

该配置说明在项目打包时，生成的代码仅仅针对 Chrome 版本 98 进行支持，于是，打包出来的结果在其他版本的chrome或者其他浏览器来说可能会出现无法运行的可能。

通过 browserslist 指定浏览器时，可使用多种方式，除了上面举例的格式之外，还有以下几种：

"defaults" 默认范围， 等同于 > 0.5%, last 2 versions, Firefox ESR, not dead.

通过流行度指定范围 ：

• > 5% 流行度前 5% 的浏览器
• >= 5% in US  在美国流行度前 5% 的浏览器
• >= 5% in alt-AS 在亚洲流行度前 5% 的浏览器

通过版本来指定范围：

• last 2 versions 每种浏览器最新的两个版本
• last 2 Chrome versions Chrome 最新的两个版本

指定浏览器版本范围：

• ChromeAndroid 103 移动端 Chrome 版本 103.
• Firefox > 20 桌面版 Firefox 版本高于 20.
• iOS >= 13.2 移动端 Safari 版本高于或等于 13.2
• not Firefox ESR 排除指定版本浏览器

指定 Nodejs 版本：

• node 10 最新 10.x.x Node.js 版本.
• node 10.4 最新 10.4.x Node.js 版本.
• node > 16 高于 16.0.0 的Node.js.
• last 2 node versions Nodejs最新的两个版本
• last 2 node major versions Nodejs 最新发布的两个大版本

通过浏览器特性指定：

• supports es6-module Script 标签支持 JavaScript modules
• supports css-grid 支持 css grid 布局

以上只是一个个示例， 也可以通过组合的方式来进行书写。

范围指定可通过 https://browsersl.ist/ 来检查是否书写正确， 例如：

浏览器支持的特性列表 https://caniuse.com/ 来进行查询，例如：