平台兼容配置

github - browserslist

很多的 npm 包（postcss、babel）需要找到当前用户期望目标代码支持的浏览器的列表，为了方便统一维护，于是诞生了browserslist，它规定了如何在项目配置浏览器列表：

.browserslistrc
package.json 的 browserslist，推荐这种方式，省去时间搜索配置文件，JSON的解析速度也非常快
node环境下，process.env.BROWSERSLIST 环境变量

如果 .browserslistrc 和 package.json 的 browserslist 同时存在可能会报错

defaults
not IE 11
maintained node versions
# 浏览器用户量在所有用户占比 > 0.1%
>0.1%

使用

npx browserslist 能够列出所有的当前配置文件支持的浏览器和对应的版本

caniuse.com/usage-table 这里是所有的

根据环境不同设置browserslist

Browserslist 将根据node的process.env 的 NODE_ENV 或者 BROWSERSLIST_ENV 属性的值，选择配置文件对应属性的 browserslist 配置，默认情况下，如果没有设置process.env，使用'production'：

package.json中

"browserslist": {
  "production": [
    "> 1%",
    "ie 10"
  ],
  "modern": [
    "last 1 chrome version",
    "last 1 firefox version"
  ],
  "ssr": [
    "node 12"
  ]
}

.browserslistrc

[production]
> 1%
ie 10

[development]
last 1 chrome version
last 1 firefox version

[ssr]
node 12

08-browserslist-平台兼容配置

平台兼容配置

使用

根据环境不同设置browserslist