未捕获的错误:生产中仅允许一个babel-polyfill实例错误

时间:2018-11-13 18:50:13

标签: reactjs webpack babel-loader babel-polyfill

我尝试了所有可能的解决方案,但是它们没有用。如果我在生产中出现 babel-polyfill 错误,该怎么办?某些浏览器不起作用?

我目前正在使用react-loadable逐页创建块。之后,我收到babel-polyfill错误。

webpack.prod.js

entry: ['babel-polyfill', path.resolve(CWD, './react/containers/root/root.prod.js')],  

.babelrc

{  
   "presets":[  
      "react",
      "es2015",
      "stage-2"
   ],
   "plugins":[  
      "react-loadable/babel",
      "syntax-dynamic-import",
      "dynamic-import-node",
      [  
         "babel-plugin-webpack-alias",
         {  
            "config":"${PWD}/config/aliases/aliases.config.js"
         }
      ],
      [  
         "import-inspector",
         {  
            "serverSideRequirePath":true,
            "webpackRequireWeakId":true
         }
      ]
   ]
}

并将这样的babelrc与babel-core一起用于节点服务器

babel-core/register(babelrc)  

并将此插件添加到babel-loader

const plugins = [
  // 'transform-decorators-legacy',
  'syntax-dynamic-import',
  'transform-react-loadable',
  'react-loadable/babel',
  'recharts',
  'transform-runtime',
  ['import-inspector', {
    'serverSideRequirePath': true,
    'webpackRequireWeakId': true,
  }],
]

在我的代码中没有其他地方使用babel-polyfill

我在reddit和stackoverflow中经历了大多数类似的问题。当他们删除重复的多边形填充时,大多数情况下都会解决此问题。

在实现代码拆分之前,我从来没有遇到过这个问题...

添加了d ev个依赖项

 "devDependencies": {
    "babel-core": "^6.26.0",
    "babel-eslint": "^8.0.0",
    "babel-jest": "^22.4.3",
    "babel-loader": "^7.1.2",
    "babel-plugin-transform-decorators-legacy": "^1.3.4",
    "babel-plugin-transform-runtime": "^6.23.0",
    "babel-plugin-webpack-alias": "^2.1.2",
    "babel-polyfill": "^6.26.0",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-jest": "^22.4.3",
    "babel-preset-react": "^6.24.1",
    "babel-preset-stage-2": "^6.24.1",
    "chalk": "^2.4.0",
    "compression-webpack-plugin": "^1.0.1",
    "copy-webpack-plugin": "^4.5.1",
    "css-modules-require-hook": "4.0.6",
    "eslint": "^4.6.1",
    "eslint-config-airbnb": "^15.1.0",
    "eslint-config-airbnb-base": "^12.0.0",
    "eslint-friendly-formatter": "^3.0.0",
    "eslint-import-resolver-webpack": "^0.8.3",
    "eslint-loader": "^1.9.0",
    "eslint-plugin-import": "^2.7.0",
    "eslint-plugin-jsx-a11y": "^5.1.1",
    "eslint-plugin-promise": "^3.5.0",
    "eslint-plugin-react": "^7.3.0",
    "eslint-plugin-standard": "^3.0.1",
    "eslint-watch": "^3.1.2",
    "express": "^4.16.2",
    "extract-text-webpack-plugin": "^4.0.0-beta.0",
    "husky": "^0.15.0-rc.9",
    "ignore-loader": "^0.1.2",
    "jest": "^22.4.3",
    "lazysizes": "^4.0.1",
    "mobile-detect": "^1.4.1",
    "postcss-loader": "^2.0.9",
    "postcss-modules-values": "^1.3.0",
    "postcss-nested": "^2.1.2",
    "puppeteer": "^1.4.0",
    "rc-tooltip": "^3.7.2",
    "react-hot-loader": "^3.1.3",
    "react-id-swiper": "^1.6.4",
    "react-masonry-component": "^6.0.0",
    "react-scroll": "^1.7.9",
    "react-tabbordion": "^1.0.2",
    "react-vertical-timeline-component": "^2.2.0",
    "react-visibility-sensor": "^3.11.0",
    "recharts": "^1.0.0-beta.10",
    "redux-devtools": "^3.4.1",
    "redux-devtools-dock-monitor": "^1.1.2",
    "redux-devtools-log-monitor": "^1.4.0",
    "redux-logger": "^3.0.6",
    "style-loader": "^0.19.0",
    "svg-to-json-webpack-plugin": "^1.1.1",
    "uglifyjs-webpack-plugin": "^1.2.2",
    "webpack": "4.19.1",
    "webpack-bundle-analyzer": "^2.11.1",
    "webpack-cli": "3.1.2",
    "webpack-dev-middleware": "^3.0.0",
    "webpack-hot-middleware": "^2.21.2",
    "webpack-merge": "^4.1.2",
    "why-did-you-update": "^0.1.1",
    "workbox-webpack-plugin": "^3.1.0"
  }

1 个答案:

答案 0 :(得分:0)

您正在使用 babel-polyfill 作为条目。您还需要在文件中使用 babel-polyfill 吗?

如果没有,也许其他图书馆也需要它。

source