跳转至主内容
Version: 2.0.0-beta.0

浏览器支持

Docusaurus 允许网站通过 browserslist 配置来定义支持的浏览器列表。

目的#

网站需要在向后兼容性和文件大小间做出平衡。 由于旧浏览器不支持现代 API 和语法,实现相同的功能会需要更多代码,但这会让所有其他用户的网站加载时间变长。 作为取舍,Docusaurus 打包工具只支持在 browserslist 中定义的浏览器版本。

默认情况下,浏览器列表由 package.json 文件作为根browserslist 字段提供。

注意

在旧浏览器中,编译后的输出将使用不支持的(过新的)JS 语法, 这将导致 React 无法初始化,并最终产生一个仅有 HTML/CSS,没有 JS 的静态网站。

默认值#

使用默认的 classic 模板初始化的网站,会在 package.json 中有以下内容:

package.json
{  "name": "docusaurus",  // ...  "browserslist": {    "production": [">0.5%", "not dead", "not op_mini all"],    "development": [      "last 1 chrome version",      "last 1 firefox version",      "last 1 safari version"    ]  }  // ...}

用人话来说,生产环境中所支持的浏览器为:

  • 市场份额超过 0.5 % 的浏览器,并且
  • 在过去 24 个月里有官方支持或更新(与 "dead" 相反),并且
  • 不是 Opera Mini。

而在开发环境中支持的浏览器为:

  • 最新版本的 Chrome Firefox Safari。

您可以使用 browserlist cli 解析任意配置,并得到真正的浏览器列表:

npx browserslist --env="production"

输出信息为生产环境中所支持的全部浏览器列表。 下面是在 2021 年 5 月的输出:

and_chr 89and_uc 12.12chrome 89chrome 88chrome 87edge 89edge 88firefox 86ie 11ios_saf 14.0-14.5ios_saf 13.4-13.7safari 14safari 13.1samsung 13.0

了解更多#

要深入了解,您可访问 browserslist 文档,特别是关于有效查询值最佳实践的内容。