babel-loader: babel-polyfill - error Error: only one instance of babel-polyfill is allowed
I’m submitting a bug report
Webpack Version: 1.14.0
Babel Core Version: 6.23.1
Babel Loader Version: 6.3.2
Please tell us about your environment: Windows 10
Current behavior: I try to use babel-polyfill for ie11 with webpack
entry: {
app: ['babel-polyfill','./src/main.js']
}
After ie11 reconize Array.includes but in some pages i have error in other browsers like Firefox
error Error: only one instance of babel-polyfill is allowed
About this issue
- Original URL
- State: closed
- Created 7 years ago
- Reactions: 13
- Comments: 25 (4 by maintainers)
Commits related to this issue
- Fix Babel polyfill issue, see https://github.com/babel/babel-loader/issues/401 — committed to ojathelonius/let-it-fly-back-end by deleted user 6 years ago
- Update webpack.prod.config.js https://github.com/babel/babel-loader/issues/401 Only be one instance of babel-polyfill — committed to amplia-iiot/wiwi-template by monicafernandez 4 years ago
- Create require-babel-polyfill.js Solution to problem: only one instance of babel-polyfill is allowed https://github.com/babel/babel-loader/issues/401#issuecomment-400257814 — committed to amplia-iiot/wiwi-template by monicafernandez 4 years ago
- Update wiwi.vue Solution to problem: only one instance of babel-polyfill is allowed babel/babel-loader#401 (comment) — committed to amplia-iiot/wiwi-template by monicafernandez 4 years ago
- :bug: Use 'idempotent-babel-polyfill' instead of 'babel-polyfill' Workaround to [this issue](https://github.com/babel/babel-loader/issues/401), causing problems in JClic module for Moodle. — committed to projectestac/jclic.js by frncesc 4 years ago
- :bug: Use 'idempotent-babel-polyfill' instead of 'babel-polyfill' Workaround to [this issue](https://github.com/babel/babel-loader/issues/401), causing problems in JClic module for Moodle. — committed to projectestac/jclic.js by frncesc 4 years ago
There was another 3rd party library which included the
babel-polyfill
in their bundle. To fix this I had to remove thebabel-polyfill
from the entry inwebpack.config
and add a conditional require to the top of myindex.js
which is the entry point.Before webpack.config:
After webpack.config:
Added to the top of ./src/index.js:
Now everything works without issue.
I was also seeing this error, but after checking my html, I was also including my bundled JS twice. Fixed by updating my HTML to ensure I only include my bundle once
I had a Chrome extension that was using babel-polyfill, which was causing this error. Took forever to track that down!
Another way to fix this is by setting
global._babelPolyfill = false;
at the top of your index.js file.Please you exclude
babel-polyfill
from your codes or exclude from webpack.entry. There can only be one instance ofbabel-polyfill
.Idempotent Babel Polyfill can be imported multiple times
When you need to actually import ‘babel-polyfill’ instead of require it, you can achieve @lipemat’s solution by adding a new file require-babel-polyfill.js with following contents:
and import that file in at the top of your apps entry point (index.js):
You should replace every
"babel-polyfill"
(either in imports, or in your webpack config’sentry
option) with"idempotent-babel-polyfill"
I had a similar problem using webpacker. I was loading two javascript apps on the same page using the
javascript_pack_tag
. Each one loads an instance ofbabel-polyfill
. I was able to resolve the issue by merging both apps and using a single loading point.@visualjerk, aka idempotent-babel-polyfill
@codejamninja Yeah, seems like your module is achieving the same. I actually did not try it out, because the solution was pretty simple.
Thanks for putting this on npm, making it even easier to use.
as @abouthiroppy already said, you either load the app bundle twice or you import babel-polyfill somewhere else in your code. Ensure it is only used once.