我尝试了所有可能的解决方案,但是它们没有用。如果我在生产中出现 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"
}