Skip to content
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

REPL confusingly lists deprecated stage-x presets, stage-2 selected by default #2814

Open
karyon opened this issue Aug 17, 2023 · 3 comments

Comments

@karyon
Copy link

karyon commented Aug 17, 2023

I've been confused again just now by stage-2 being selected by default. I'm wondering why is that even part of the REPL UI, given that these presets have been deprecated for five years now?

Backstory: Suppose I'm using preset-env with the default targets as recommended by the docs and want to quickly check how e.g. class properties are transpiled, so I go to https://babeljs.io/repl. I see that my class properties are transpiled, which is weird because they are not transpiled in my project. I notice the "presets" section lists some stage presets that I have never heard of, and stage-2 is enabled by default. Removing it makes the REPL work like I would expect. I wonder, maybe I should be using the stage-2 preset if it's the default in the REPL? I google it and find https://www.npmjs.com/package/@babel/preset-stage-2, which says "As of v7.0.0-beta.55, we've removed Babel's Stage presets. Please consider reading our blog post", and the blog post is from July 2018 and is all about why those stage-x presets shouldn't be used and are not shipped anymore. I wonder, maybe they didn't get around updating the website, but don't find any issue even talking about this, and I'm left very confused as to what is going on?

@babel-bot
Copy link
Contributor

Hey @karyon! We really appreciate you taking the time to report an issue. The collaborators
on this project attempt to help as many people as possible, but we're a limited number of volunteers,
so it's possible this won't be addressed swiftly.

If you need any help, or just have general Babel or JavaScript questions, we have a vibrant Slack
community
that typically always has someone willing to help. You can sign-up here
for an invite.

@JLHwung
Copy link
Contributor

JLHwung commented Aug 17, 2023

I agree that it could be confusing to users. Here I provide some context:

The current REPL was designed when stage-x presets were still a thing. Later we deprecated the preset in favor of preset-env but we didn't figure out a way to demonstrate Babel's ability to transform many ES proposals on REPL: So the stage-2 preset, as well as other stage presets become convenient toggles on REPL: They let you see how Babel transforms ES proposals like decorators, pipeline operators, records and tuples and so on, since they will not be covered by preset-env until they are advanced to stage 4.

@karyon
Copy link
Author

karyon commented Aug 18, 2023

I see. So first I thought that class fields were transpiled because the stage-x presets wasn't updated in five years, as the npm package turned up by the google search suggested. Your comment sounds like they are actually still updated with new proposals. Which made me wonder again, why are class fields transpiled even though they are in stage 4 by now? Looking at the code, it seems like proposals cannot be removed from the stage-x presets because that would be a breaking change, which is understandable but does not make sense in the context of the REPL and adds to the confusion there.

So I see multiple ways to fix my source of confusion:

  • Replace the stage-x presets in the REPL by something that's closer to the recommended way to use such proposal plugins
  • Remove stage-4 proposals from the stage-x presets in the REPL
  • Remove the stage-2 preset from the default presets (preferably together with the fix above)

If the stage-x presets are kept, what would also help:

  • Provide some clarity, like putting them in a "experimental syntax presets" section, and explaining that these presets are just a showcase and not meant to be actually used.
  • Document which plugins are contained. I couldn't find that information apart from searching in babel's code.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants