-
-
Notifications
You must be signed in to change notification settings - Fork 27k
exclude unnecessary plugins for target browsers #8030
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
base: main
Are you sure you want to change the base?
Conversation
Hey @heygrady, thanks for the hard work on this. I'm thinking that maybe a cleaner approach is to remove the use of the plugins and allow
|
Whatever works is fine by me. The other plugins (like Meaning, I thought it was interesting to use some of the mechanisms that preset-env uses to deepen our support for browserslist and allow plugins to be automatically managed that way. I've just finished a project to support multiple builds for multiple targets using my fork of react-scripts. I found it useful to rely on those same mechanisms in the webpack config, for instance, for setting terser config options based on browserslist. Regardless, it would be nice to have the bug in babel-preset-react-app fixed one way or another. |
Pushed a commit where I removed |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I don't believe it's possible to side-step the need to know what plugins @babel/preset-env
would apply and still support modern browsers.
- We need to update configuration to
@babel/preset-react
for the use of spread - We need to disable
regenerator
in@babel/plugin-transform-runtime
when it isn't needed - We need to skip
@babel/plugin-transform-destructuring
when it isn't needed
[isObjectRestSpreadProposalRequired | ||
? 'useBuiltIns' | ||
: 'useSpread']: true, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Here we need to use native spread whenever possible. This requires knowing if our targets require 'proposal-object-rest-spread'.
@@ -176,7 +182,7 @@ module.exports = function(api, opts, env) { | |||
// explicitly resolving to match the provided helper functions. | |||
// https://github.com/babel/babel/issues/10261 | |||
version: require('@babel/runtime/package.json').version, | |||
regenerator: true, | |||
regenerator: isRegeneratorTransformRequired, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Here we want to disable regenerator when it's not needed.
// Historically there was a bug that made this plugin required. | ||
// https://github.com/babel/babel/issues/7215 | ||
// This plugin is no longer required to make plugin-proposal-object-rest-spread work: | ||
// https://github.com/babel/babel/pull/10275 | ||
isDestructuringTransformRequired && [ | ||
require('@babel/plugin-transform-destructuring').default, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Here we need to undo this custom override when it's not needed.
I'll bring it up with the team and see what we think is the best approach. |
e12807a
to
ab14e01
Compare
Some of the advanced
babel-preset-react-app
customizations inadvertently re-enable plugins that@babel/preset-env
disables (based on browserslist).I ran into this issue while enabling modern builds for my application. I noticed that destructure and spread transforms were being applied even for very future-forward browser targets like
last 1 chrome version
.This PR uses
some of the internals of@babel/preset-env
@babel/helper-compilation-targets
and@babel/compat-data
to know which plugins to apply and disables some customizations when they are not necessary given the browser targets.