3 ms·

Maybe don't use metaprogramming, then? The Babel example problem in the article is a fascinating one because that's someone's metaprogramming that's just lost

Maybe don't use metaprogramming, then? The Babel example problem in the article is a fascinating one because that's someone's metaprogramming that's just lost in the ether of time and the labyrinthine tower of a Babel install someone's too afraid to break to just tear down. Not only is it an unnecessary downlevel transform in 2022, but it doesn't look like any of the official transforms that common Babel transforms produced, so who knows what metaprogramming thought might be a good idea that delivers that from that configured stack? As others have pointed out: JSX transforms have non-Babel options (also including Vite, esbuild, and Typescript). As for other metaprogramming commonly done in Babel: I would point out that the Stage 0 Decorators that Angular was built on (not to be confused with the Stage 3 Decorators that might actually come to JS) have relied on very specific Typescript build options anyway and the double-up that Angulars tools by default do of also feeding that Babel is kind of silly. One of those parentheticals also slightly buries the lede that there is a Decorators proposal at Stage 3 and likely to get added to Browsers "in the near future" for those that desperately want to do metaprogramming in JS to have metaprogramming in JS proper, no Babel needed. (There are Stage 1 proposals to offer even more meta- and reflection tools beyond that directly in the language.) In 2022 though, it is worth asking what in JS needs metaprogramming? A lot of applications get by without it just fine.

zelphirkalt 4y ago
How would I remove all console.log from my code automatically during a build? How would I add syntactically nice things to JS? How would I get my environment variable values set for the build into the code, which is to be run in a browser? JS being JS, there seem to be no good facilities in the language itself to do that inside the language. My understanding is, that babel was created to do these things outside of the running script. Maybe there is another way that I am not aware of?
- WorldMaker 4y ago
  > How would I remove all console.log from my code automatically during a build? Make it a lint warning? Add a higher-level logging abstraction and/or library? I know Webpack and Esbuild both have ways to define symbols like `console` at build time and get dead code elimination. No Babel needed. > How would I add syntactically nice things to JS? What do you need in 2022? I definitely understand that in 2014 there were a lot of nice polyfills and prollyfills to be found in the Babel ecosystem for syntax that made the language a lot nicer to work in, but in the last eight years, most of them are in the language itself now and supported in nearly every browser. ES2015+ has so much of that goodness baked in and every browser generally supports ES2015+ well (and so does Node, mostly). Most caniuse statistics says browsers are caught up to at least ES2020. We are over and on the side of the hump that Babel helped collectively prepare us for. Yes, there's still a usefulness there in testing future ideas and it will probably still always be a collaborative tool for helping with TC39 early stage testing of proposals. But at this point, should your Production builds really rely on anything before Stage 3 with TC-39? For stuff in Stage 3+ there's always Typescript as an alternative to Babel. > How would I get my environment variable values set for the build into the code, which is to be run in a browser? You do that in Babel? I've never heard of anyone doing that Babel. I've seen all sorts of dynamic import strategies in Webpack and other builders. I've done some neat things with JSON files and sometimes builder imports and sometimes just good old fetch().

zelphirkalt 4y ago

How would I remove all console.log from my code automatically during a build? How would I add syntactically nice things to JS? How would I get my environment variable values set for the build into the code, which is to be run in a browser? JS being JS, there seem to be no good facilities in the language itself to do that inside the language. My understanding is, that babel was created to do these things outside of the running script. Maybe there is another way that I am not aware of?

WorldMaker 4y ago
> How would I remove all console.log from my code automatically during a build? Make it a lint warning? Add a higher-level logging abstraction and/or library? I know Webpack and Esbuild both have ways to define symbols like `console` at build time and get dead code elimination. No Babel needed. > How would I add syntactically nice things to JS? What do you need in 2022? I definitely understand that in 2014 there were a lot of nice polyfills and prollyfills to be found in the Babel ecosystem for syntax that made the language a lot nicer to work in, but in the last eight years, most of them are in the language itself now and supported in nearly every browser. ES2015+ has so much of that goodness baked in and every browser generally supports ES2015+ well (and so does Node, mostly). Most caniuse statistics says browsers are caught up to at least ES2020. We are over and on the side of the hump that Babel helped collectively prepare us for. Yes, there's still a usefulness there in testing future ideas and it will probably still always be a collaborative tool for helping with TC39 early stage testing of proposals. But at this point, should your Production builds really rely on anything before Stage 3 with TC-39? For stuff in Stage 3+ there's always Typescript as an alternative to Babel. > How would I get my environment variable values set for the build into the code, which is to be run in a browser? You do that in Babel? I've never heard of anyone doing that Babel. I've seen all sorts of dynamic import strategies in Webpack and other builders. I've done some neat things with JSON files and sometimes builder imports and sometimes just good old fetch().