Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to list what transforms @babel/preset-env includes?

Tags:

babeljs

I like how I can use http://browserl.ist/ to see what browsers the targets query will target in @babel/preset-env.

Is there any similar tools to list what Babel plugins (transforms etc.) the env preset actually includes?

I'm using Webpack as my bundler if it matters.

like image 719
Epeli Avatar asked Sep 17 '18 10:09

Epeli


People also ask

What is included in Babel preset ENV?

@babel/preset-env is a smart preset that allows you to use the latest JavaScript without needing to micromanage which syntax transforms (and optionally, browser polyfills) are needed by your target environment(s). This both makes your life easier and JavaScript bundles smaller!

What does Babel preset react?

In Babel, a preset is a set of plugins used to support particular language features. The two presets Babel uses by default: es2015 : Adds support for ES2015 (or ES6) JavaScript. react : Adds support for JSX.

How do you use Babel preset?

Using a Preset Within a Babel config, if the preset is on npm, you can pass in the name of the preset and Babel will check that it's installed in node_modules already. This is added to the presets config option, which takes an array. Otherwise, you can also specify a relative or absolute path to your presets.

Does Babel preset order matter?

Ordering matters for each visitor in the plugin. This means if two transforms both visit the "Program" node, the transforms will run in either plugin or preset order. Plugins run before Presets. Plugin ordering is first to last.


2 Answers

try add debug:true in @babel/preset-env options, it will list all plugin in use

{
  "presets": [
    [
      "@babel/preset-env",
      {
        "debug": true,
        "targets": {
          "chrome": 49,
          "firefox": 64,
          "safari": 9,
          "edge": 13,
          "ios": 9
        }
      }
    ]
  ]
}

enter image description here

like image 171
Littlee Avatar answered Nov 13 '22 02:11

Littlee


You can always check out the source for @babel/preset-env, namely the available-plugins.js file lists the available plugins in the preset.

like image 36
rabidpug Avatar answered Nov 13 '22 02:11

rabidpug