question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Can't forcefully `include` a specific polyfill with preset-env `useBuiltIns=usage`

See original GitHub issue

Bug Report

According to doc, include should force the inclusion of a polyfill, even if useBuiltIns=usage, even if source code does not contains reference to the function.

Current Behavior

  • Forcing polyfill inclusion in preset-env does not seem to work. The resulting code does not contain the polyfill and an error is thrown: Invalid Option: The plugins/built-ins '@babel/plugin-transform-object-assign' passed to the 'include' option are not valid. Please check data/[plugin-features|built-in-features].js in babel-preset-env

Input Code

  • Any JS code that does not make use of Object.assign()

Expected behavior/code

  • The code should contain the es6.object.assign (see below Babel configuration).

Babel Configuration (.babelrc, package.json, cli command)

{
    "plugins": [
	"@babel/plugin-transform-object-assign"
    ],
    "presets": [
	[
	    "@babel/preset-env",
	    {
		"useBuiltIns": "usage",
		"include": [
		    "@babel/plugin-transform-object-assign"
		]
	    }
	]
    ]
}

Environment

  • Babel version(s): v7.1.2
  • Node/npm version: Node 10.12.0/npm 6.4.1
  • OS: Ubuntu 18.04
  • Monorepo: yes
  • How you are using Babel: browserify ( babelify ( ) )

Context

  • I bundle a javascript source included in a website. But some additional javascript files provided by some webpage themselves may make use of ES6 functions. I would like to forcefully provide a couple of manually selected polyfills to the bundle.

Issue Analytics

  • State:open
  • Created 5 years ago
  • Reactions:12
  • Comments:12 (4 by maintainers)

github_iconTop GitHub Comments

11reactions
carloscuestacommented, Feb 12, 2020

I’m facing the same issue and I don’t know if this the expected behaviour or it is a misunderstanding of the babel-preset-env docs.

According to babel-preset-env include docs this field on is used to:

Screenshot 2020-02-12 at 09 38 46

So according to this statement I’m understanding that I can include a a core-js built in polyfill to be always present in my bundle. Like this:

"include": ["es.weak-set"]

However seems that this is not working.

Even though my code it’s not specifically requiring this polyfill. My use case is that an external node_modules dependency uses WeakSet and that needs to be polyfilled to support IE11.

So the only option I had to include the polyfill is to import it once on my application to be bundled with everything. Like if I was importing an external module.

import 'core-js/es/weak-set'
6reactions
gavinsharpcommented, Nov 27, 2018

@joacim-boive can you show the code where useBuiltIns: usage is not detecting Promise?

A common case of this is a dependency that just isn’t loaded via babel-loader (e.g. an external library in node_modules). So not really a Babel issue, but there aren’t really any clean workarounds if include doesn’t work (you need to either switch to useBuiltIns: entry, force the import by putting in a dummy reference somewhere in your code to the polyfilled object, or force the external library to be babel-loaded, which often causes other issues).

Read more comments on GitHub >

github_iconTop Results From Across the Web

babel/preset-env
This behavior is deprecated because it isn't possible to use @babel/polyfill with different core-js versions. useBuiltIns: 'usage'. Adds specific imports for ...
Read more >
Confused about useBuiltIns option of @babel/preset-env ...
Yes, if you want to include polyfills based on your target environment. TL;DR. There're basically 3 options for useBuiltIns : "entry": when ...
Read more >
babel-preset-env/README.md - UNPKG
> A Babel preset that can automatically determine the Babel plugins and polyfills you need based on your supported environments. 4. 5, ``` ......
Read more >
@rtsao/babel-preset-env - npm package | Snyk
useBuiltIns : 'usage'. Adds specific imports for polyfills when they are used in each file. We take advantage of the fact that a...
Read more >
Loading JavaScript - SurviveJS
If you use webpack.config.babel.js, take care with the "modules": false, setting. ... @babel/preset-env allows you to polyfill certain language features for ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found