2019年针对IE11的Polyfills

Question

这是2019年，当我们没有更好的工作要做时，我们希望支持IE11，我不得不承认我对所有可用的polyfill感到有些困惑。

• babel-polyfill似乎推荐core-js
• core-js
• es5-shim和es6-shim

据我所知，所有这些东西都应该启用较新版本的Ecmascript，但不对其余版本进行修补。我有几个自定义的polyfill，例如支持CustomEvent。

我认为它不会改变任何东西，但是我正在使用：

• webpack 2.7.0
• babel 6.16

现在在我的主脚本顶部：

require('core-js');

但是我仍然得到：

Object doesn't support property of method 'Symbol(Symbol.iterator)_a.Kr7pt1C'

似乎主要是不受支持的Ecmascript迭代功能。

关于在问题的宏观层面上做什么的任何建议？

编辑

Symbol.iterator实际上是由于缺少“ for ...”的polyfill。

Answer 1

在使用Babel进行转译时，可以使用@babel/preset-env预设并将目标环境设置为IE11 *。

1. 安装预设：yarn add @babel/preset-env --dev

2. 在Babel配置中配置目标：

{
  "presets": [
    ["@babel/presets-env", {
      "targets": {
        "browsers": [
          "ie": "11"
        ]
      },
    }]
  ]
}

*来自the docs

  

@ babel / preset-env接受您指定的任何目标环境，并根据其映射检查它们，以编译插件列表并将其传递给Babel。

Answer 2

在official documentation中，显示为“要使用Iterators，您必须包含Babel polyfill。” 您可以尝试使用npm install --save @babel/polyfill安装它并将其与应用程序入口点顶部的require("@babel/polyfill")一起使用。

  

为方便起见，提供了polyfill，但您应将其与@babel/preset-env和useBuiltIns option结合使用，以使其不包含并非总是需要的整个polyfill。否则，我们建议您手动导入各个polyfill。

您也可以尝试导入core-js/fn/symbol/iterator.js。