“只允许一个 babel-polyfill 实例”错误答案

【问题标题】："Only one instance of babel-polyfill is allowed" error“只允许一个 babel-polyfill 实例”错误
【发布时间】：2017-10-09 16:32:09
【问题描述】：

我需要帮助诊断和修复此错误：

"Error: only one instance of babel-polyfill is allowed"

我的 package.json 中有以下内容：

"devDependencies": {
    "babel-core": "^6.23.1",
    "babel-jest": "^19.0.0",
    "babel-loader": "^6.3.2",
    "babel-plugin-transform-object-rest-spread": "^6.23.0",
    "babel-preset-es2015": "^6.22.0",
    "babel-preset-react": "^6.23.0" ...

"dependencies": {
    "babel-polyfill": "^6.23.0" ...

我的 webpack 配置中的这个和这个入口行：

entry: ["babel-polyfill", path.resolve(APP_PATH, 'index')],
...
module: {
 rules: [
  {
    test: /\.js$/,
    exclude: /node_modules/,
    loader: 'babel-loader',
    query: {
      // specify that we will be dealing with React code
      presets: ['react', 'es2015']
    }
  }
]}

【问题讨论】：

看起来罪魁祸首是我的 webpack 配置中的 HtmlWebpackPlugin。如果我删除这个插件，错误就会消失。
尝试将 entry: ["babel-polyfill", path.resolve(APP_PATH, 'index')] 更改为 entry: [path.resolve(APP_PATH, 'index')]
我正在使用 babel-polyfill，所以我需要将它放在某个地方。我也可以在某处添加导入，但我得到了同样的错误。如果我删除它，我会收到错误：Uncaught ReferenceError: regeneratorRuntime is not defined.

标签： reactjs webpack babeljs babel-polyfill

【解决方案1】：

我遇到了同样的问题，我通过从 index.js 脚本中删除 require('babel-polyfill'); 来消除错误。

【讨论】：

【解决方案2】：

Idempotent Babel Polyfill 可以多次导入

从 NPM 安装

npm install --save idempotent-babel-polyfill

然后导入

import 'idempotent-babel-polyfill';

【讨论】：

【解决方案3】：

Only one instance of babel-polyfill is allowed 通常在使用 CommonsChunkPlugin 或 HtmlWebpackPlugin 时如果被包装的文件顺序不正确时出现。

对于 HtmlWebpackPlugin，您可以使用 chunksSortMode 手动对文件进行排序

使用"webpack": "^1.14.0"：

new HtmlWebpackPlugin({
  ...
  chunksSortMode: 'dependency',
  ...
}),

来源：gdi2290 @ GitHub - 1 Jul. 2016 / 22 Jan. 2018

【讨论】：

【解决方案4】：

如果罪魁祸首是HtmlWebpackPlugin，则需要在实例化插件时添加选项inject: false。没有此选项的某些配置会导致您构建的 javascript 代码被加载两次。

【讨论】：

非常感谢您的回答！也为我工作

【解决方案5】：

可能你是从其他 babel 模块间接获得的。

可能的解决方案：

使所有版本的 babel 模块相同。可能错误是由于 babel-polyfil 的版本不同造成的。
从 package.json 中删除 babel-polyfil，以便从
中使用它 babel-plugin-transform-object-rest-spread.

参考： https://github.com/babel/babel/issues/1019

jameslk 的评论

我还是想通了。看起来 babel-runtime 已移至 babel-plugin-transform-runtime ，需要将其添加到插件列表中才能使用它。如果在某处记录在案会有所帮助。

【讨论】：

抱歉回复晚了，非常感谢您的回答。我尝试了一些事情，最终从我的依赖项中删除了 HtmlWebpackPlugin。不是一个理想的解决方案，但至少错误消失了。考虑到您提供的两种解决方案：1.我只能在我的节点模块中找到一个 babel-polyfill 安装，2.删除 babel-polyfill 后我仍然得到同样的错误。我认为，问题在于我的依赖项中有 babel-cli 和 html-webpack-plugin ，我不知道如何使它们共存。