IE11 中的故事书有问题。 “未定义弱集”答案

【问题标题】：Trouble with storybook in IE11. "WeakSet is not defined"IE11 中的故事书有问题。 “未定义弱集”
【发布时间】：2020-04-27 00:51:16
【问题描述】：

我在 IE11 中运行故事书时遇到问题。这是我在 IE11 控制台中看到的错误：

我在 babel 中使用 core-js 是这样的：

presets: [
    ['@babel/preset-env', {
      modules: false,
      loose: true,
      useBuiltIns: "usage",
      corejs: 2,
      debug: true,
      targets: {
        browsers: [
          'last 2 Chrome versions',
          'last 2 Firefox versions',
          'last 2 Safari versions',
          'last 2 Opera versions',
          'last 2 Edge versions',
          'last 2 iOS versions',
          'last 2 ChromeAndroid versions',
          'IE 11'
        ]
      }
    }],
    '@babel/preset-react'
  ]

这是 webpack 中的 babel-loader：

{
  test: /\.jsx?$/,
  include: [resolve(__dirname, 'src')],
  exclude: /node_modules/,
  loader: 'babel-loader'
}

也用 core-js@3.6.1 尝试过，但我得到了相同的结果。

UPD：错误的翻译：WeakSet 未定义。

【问题讨论】：

标签： reactjs webpack babeljs storybook core-js

【解决方案1】：

对于 IE11，你必须做一个 polyfill 才能让 WeakSet 工作。看看这个回购https://github.com/ungap/weakset

用于 IE11 或具有 WeakMap 但没有 WeakSet 的浏览器的 polyfill。

CDN 通过https://unpkg.com/@ungap/weakset

ESM 通过import WeakSet from '@ungap/weakset'

CJS 通过const WeakSet = require('@ungap/weakset')

与 IE9 兼容，在 IE8 中与 ES5 shim 兼容（也可能更低）。

【讨论】：

试过了。然后就是 WeakMap 有问题等等。问题是core-js必须修复它，但它没有

【解决方案2】：

尝试了很多解决方案，但唯一对我有用的是上述 CDN 的老式脚本 src。在您的故事书文件夹中，添加一个名为 preview-head.html 的文件并添加此脚本链接：

&lt;script src="https://unpkg.com/@ungap/weakset"&gt;&lt;/script&gt;

【讨论】：

【解决方案3】：

对于 Angular 开发人员，npm i @ungap/weakset 并将其导入到angular.json 下的scripts。

"scripts": [
    "node_modules/@ungap/weakset/min.js"
],

通过polyfills.ts 导入将不起作用。

【讨论】：