confused with babel preset configs between @babel/env and @babel/preset-env

I try to config a environment to develop javascript with babel and webpack.

But I don't understand babel configuration about presets.

In Usage Guide, we can see that presets with "@babel/env".

But other places in document, I cannot see such a configuration more, instead of "@babel/preset-env". for example here https://babeljs.io/docs/en/babel-preset-env

I can not find out the difference between "@babel/env" and "@babel/preset-env" everywhere with my poor English, I do really read document again and again, without luck.

Maybe they are same?

Btw, targets sets seems not work, remove targets also can run normally in ie9+(or what's it default targets), if I wish my es6 script can be transformed to compatibility ie8, thus it not most important.

here is my project sdk-dev-env

// https://babeljs.io/docs/en/configuration
const presets = [
  [
    '@babel/env',
    {
      // https://babeljs.io/docs/en/babel-preset-env#targets
      // TODO: how to compatibilite with ie 8
      targets: {
        ie: '8',
        edge: '17',
        firefox: '60',
        chrome: '67',
        safari: '11.1'
        /**
         * you can also set browsers in package.json
         * "browserslist": ["last 3 versions"]
         * relative links:
         * https://github.com/browserslist/browserslist
         */
      },
      corejs: '3',
      // corejs: { version: 3, proposals: true },
      /**
       * https://babeljs.io/docs/en/usage#polyfill
       * https://github.com/zloirock/core-js#babelpreset-env
       * "usage" will practically apply the last optimization mentioned above where you only include the polyfills you need
       */
      useBuiltIns: 'usage'
    }
  ]
]
const plugins = []

if (process.env['ENV'] === 'prod') {
  // plugins.push(...);
}
module.exports = { presets, plugins }

I hope to know they are same or not, if not, what different.

And the best way to use babeljs 7.4 with core-js 3

Solution 1:

Maybe they are same?

That is correct, the preset- piece is optional. Since you are doing

presets: ["@babel/env"]

Babel already knows that it is a preset since it is in the presets array, so it will add the preset- into the module name automatically.

This applies to plugins as well.

See the table in the Babel issue where this was implemented for more examples.