Need an example babel.config.js w/ how to achieve pollution-free polyfills via core-js3
- Dominant language
- TypeScript
- Stars
- 777
- Forks
- 1.4k
- Avg merge
- 16h 45m
- Merged PRs (30d)
- 3
Description
I was very excited to use core-js3 when I found out that it supported pollution-free polyfills for String.prototype.includes + other instance methods.
According to the babel [documentation](https://babeljs.io/docs/en/babel-plugin-transform-runtime) and [release notes](https://babeljs.io/blog/2019/03/19/7.4.0#core-js-3-7646-https-githubcom-babel-babel-pull-7646), pollution-free polyfills are one of the major value-adds that core-js3 brings. We need to link from the docs to a howto page that explains the feature.
Things that were not clear when trying to achieve pollution-free polyfills:
* They are not the default for core-js3
* What the minimal packages required are
* What a minimal babel config looks like
When I posted on Babel's Slack, someone sent me the release notes for [core-js@3](https://github.com/zloirock/core-js/blob/master/docs/2019-03-19-core-js-3-babel-and-a-look-into-the-future.md#babelruntime), which mentioned 3-4 distinct packages (one of which doesn't exist).
Eventually, with 2 days of googling and searching for "pollution" and "pollute" throughout core-js and babel docs, I came up with this answer:
```js
module.exports = {
"presets": [
"@babel/preset-env"
],
/**
* To add non-polluting polyfills for instance method transforms (String.prototype.includes, etc)
* `npm i -D @babel/plugin-transform-runtime`
* and pass in { corejs: 3 } to the options below...
*/
"plugins": [
["@babel/plugin-transform-runtime", {
"corejs": 3
}]
]
}
```
I'm still very grateful for the ability to transform instance methods without polluting the global scope. It works seamlessly once it's configured. Just want to make the information on how to get it done more accessible :-)
Contributor guide
No contributing guide indexed for this repository
Research direction
Start with the Babel documentation page for @babel/plugin-transform-runtime and the linked core-js@3 release notes. Use the issue's babel.config.js example as the basis for a how-to page or linked documentation that explains the non-default setup, minimal packages, and expected pollution-free behavior.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- babel, javascript
- Domain
- documentation
- Issue type
- Documentation
- Difficulty
- 2/5
- Estimated time
- 1-3 hours
- Activity status
- Stale
- Clarity
- Clearly specified
- Newbie friendliness
- 35/100