2

我的@babel/preset-env配置工作正常，除了 IE11。当我在 IE11 中运行它时，我得到了这个错误：

SCRIPT438：对象不支持属性或方法“分配”

谷歌搜索错误后，我看到我需要使用babel/polyfill，但它已被弃用，建议您现在使用core-js. 对于如此广泛使用的工具，官方文档缺乏。

我关注了其他 StackOverflow 帖子并提出了这个解决方案，但仍然出现错误：

包.json：

"devDependencies": {
    "@babel/core": "^7.10.2",
    "@babel/preset-env": "^7.10.2",
    "babel-loader": "^8.1.0",
    "core-js": "^3.6.5",
    ...
}

webpack.config：

{
   test: /\.(js)$/,
   exclude: /node_modules/,
   use: {
      loader: 'babel-loader',
      options: {
         // presets: ['@babel/preset-env'],
         presets: [
            [
               "@babel/preset-env", {
                  "targets": {
                     "browsers": ["last 2 versions", "> 0.1%", "not dead", "ie >= 11"]
                  },
                  "useBuiltIns": "usage",
                  "corejs": 3
               }
            ]
         ]
      }
   }
},

我没有babelrcorbrowserlists文件，因为我想让它尽可能简约。

为什么这不起作用，为什么我继续收到此错误：

function e(){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e)}
SCRIPT438: Object doesn't support property or method 'assign'
4

2 回答 2

2

为未来的读者回答我自己的问题。

所以@babel/polyfill 被corejs 和@babel/runtime-corejs3 的使用所取代。执行以下操作以获取 IE11 中Object.assign()错误的 polyfill。

1.安装包

npm i core-js @babel/core @babel/runtime-corejs3--保存开发

这会在撰写本文时安装 core-js v3.6.5。

2.更新webpack

"useBuiltIns": "usage"将和添加"corejs": 3到您的 babel/preset-env 规则：

module: {
   rules: [
      {
         test: /\.(js)$/,
         exclude: /node_modules/,
         use: {
            loader: 'babel-loader',
            options: {
               presets: [
                  [
                     "@babel/preset-env", {
                        "useBuiltIns": "usage", 
                        "corejs": 3
                     }
                  ]
               ]
            }
         }
      },
      // Your other rules...
   ]
},

3.（可选）添加您的浏览器

如果要指定自己的 browserslist 字符串，可以将其添加到 package.json 中：

"devDependencies": {
   // my dev dependencies
},
"dependencies": {
   // my dependencies
},
"browserslist": "last 2 versions, > 0.1%, not dead"

4.添加corejs的导入

您需要将 core-js 导入到需要 polyfill 的地方。我把它放在我的根./App.js上，让我覆盖全球。

import "core-js/stable";

这应该可以修复 IE11 中的 Object.assign() 错误，但是......

5. 其他 polyfills..

所以在这样做之后，我在使用.closest()IE11 不支持时遇到了另一个错误。为此获得 polyfill 的一种快速简单的方法是将此脚本添加到您的

<script src="https://unpkg.com/element-closest"></script>

您也可以将其作为包导入，但上述交付的 CDN 快速且简单。

于 2020-06-28T13:44:52.690 回答
1

有类似的问题，设置是使用 .config 和 browserlistrc

尝试在下面进行更改，看看是否有帮助

corejs: { version: 3, proposals: true }
于 2020-06-27T02:56:07.387 回答