2019 年 IE11 的 Polyfills

Posted 2023-02-18

【中文标题】2019 年 IE11 的 Polyfills

【英文标题】：Polyfills in 2019 for IE11

【发布时间】：2019-11-23 01:09:45

【问题描述】：

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

babel-polyfill 好像推荐core-js core-js es5-shim 和 es6-shim

据我所知，所有这些都应该启用较新版本的 Ecmascript，而不是修补其余部分。我有几个自定义 polyfill，例如支持自定义事件。

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

webpack 2.7.0 通天塔 6.16

现在我的主脚本顶部有：

require('core-js');

但我仍然得到：

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

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

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

编辑

Symbol.iterator 实际上是缺少“for ... of” polyfill。

编辑：解决方案

我的完整配置在这个答案Include node_modules directory in Babel 7中可见

【问题讨论】：

@Andreas 非常欢迎，谢谢 ;) 它应该如何有用？

只要使用babel，将代码转译成IE11能理解的版本即可。

我正在研究这个选项。

你成功完成这项工作了吗？

@Jayavel 是（问题的最后一行包含指向我最终配置的链接）

【参考方案1】：

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

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

在 Babel 配置中配置目标：

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

*来自the docs

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

【讨论】：

全是错别字……对我来说也是如此，例如恕我直言应该是 "presets": [ ["@babel/preset-env", "targets": "ie": "11" ] ] 但是：在 IE11 中查找和条目出现问题....所以甚至对我都不起作用

Targets.browsers 是一个字符串或字符串数​​组。以上述方式指定浏览器目标，应为"targets": "ie": "11"

【参考方案2】：

在official documentation 中，它说“要使用迭代器，您必须包含 Babel polyfill。” 您可以尝试使用 npm install --save @babel/polyfill 安装它并使用 @987654326 @ 在您的应用程序入口点的顶部。

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

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

【讨论】：

在我的 polyfills.ts 中导入 e-js/fn/symbol/iterator.js 效果很好