在使用create-react-app的React应用程序中充填ES6功能的最佳方法

我一直在Internet Explorer上测试我的React.js应用程序,令我惊讶的是,ES6代码像Array.prototype.includes()打破了它。我正在使用creat-react-app入门套件,我认为babel是其中的一部分,并且它允许我编写ES6代码。

事实证明它并不是那么简单。据我所知,他们并不是因为并非每个人都需要它而选择不包含很多polyfill,这会减慢构建时间。例如在这里这里曾经有过尝试对此进行记录,但是没有提到如何自己实际执行polyfills。只是这个:

如果您使用任何其他需要运行时支持的ES6 +功能(例如Array.from()或Symbol),请确保手动添加了适当的polyfill,或者要使用的浏览器已经支持它们。

那么...“手动”包括它们的最佳方法是什么?我以为那是通天塔的一部分?我应该部分导入babel-polyfill的元素吗?

Davaid泡芙2020/03/13 17:01:02

值得的是,我在使用新的Google Search Console和我的React应用程序(create-react-app)时遇到了问题。添加es6shim后,所有问题都解决了。

我在公共index.html页面上添加了以下内容。

<script src="https://cdn.polyfill.io/v2/polyfill.min.js"></script>
阿飞十三2020/03/13 17:01:02

使用具有polyfill react-app-polyfill来实现React中常用的ES6功能。它是create-react-app的一部分确保按照自述文件中的定义将其包括在index.js的开头。

2020/03/13 17:01:02

从您的Create React App项目中弹出

之后,您可以将所有填充填充物放入/config/polyfills.js文件中

将以下内容放在文件末尾

Object.values = Object.values ? Object.values : o=>Object.keys(o).map(k=>o[k]);

Webpack将自动为您修复此问题;)