如果你正在开发 React 应用，并且需要支持旧版浏览器，那么 react-app-polyfill 可能是一个不错的选择。本文将介绍如何使用该 npm 包来解决兼容性问题。
什么是 react-app-polyfill？
react-app-polyfill 是一个官方维护的 npm 包，它提供了一系列 JavaScript API 的 polyfills，以使得您的 React 应用在旧版浏览器上能够正常运行。这些 polyfills 包括 Promise、Object.assign、Array.from、fetch 等等。
如何使用 react-app-polyfill？
首先，安装 react-app-polyfill：
npm install react-app-polyfill
接下来，在您的应用程序的入口文件（通常是 index.js）中添加以下代码：
import 'react-app-polyfill/ie11'; import 'react-app-polyfill/stable';
其中 ie11 将会加载针对 Internet Explorer 11 的 polyfills，而 stable 则会加载其他现代浏览器中必要的 polyfills。请注意，这两个选项都是必需的。
最后，您需要在 .browserslistrc 文件中设置您要支持的浏览器版本，例如：
> 0.2% not dead IE 11
这里我们支持市场份额大于 0.2% 的浏览器，不支持已经停止维护的浏览器以及 Internet Explorer 11。
示例代码
下面是一个示例 React 组件，演示了如何使用 fetch API，并在旧版浏览器上正常运行：
-- -------------------- ---- -------
------ ----- ---- --------
----- --- ------- --------------- -
----- - - ----- ---- --
----- ------------------- -
----- -------- - ----- -------------------
----- ---- - ----- ----------------
--------------- ---- ---
-
-------- -
------ -----------------------------
-
-
------ ------- ----当您使用 react-app-polyfill 后，这个组件将会在大多数现代浏览器和 Internet Explorer 11 上正常运行。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/46450