How to compile ES6+ code to ES6 with webpack?

Question

I want to compile my code to ES6 not ES5. Here is my babelrc.

{
"presets": [
    [
        "env",
        {
            "modules": false,
            "useBuiltIns": true,
            "targets": {
                "browsers": ["Chrome >= 60"]
            }
        }
    ],
    ["react"],
    ["stage-2"]
]}

And with babel-cli, the right ES6 code can be compiled. For example

But when I use webpack, babel-loader in the same babel config, my ES6 code was compiled to ES5.

So how can i compile ES6+ code to ES6+ with Webpack?

Does webpack compile ES6+ code to ES5 ?

Thanks. I found my error. I insert two babel-loader, one use es5 config, the other use es6 config. So sorry. — Zhendong

Jasper Bernales Jasper Bernales · Accepted Answer · 2019-08-30T10:10:41

There's option target option esmodules. check it out here.

{
"presets": [
    [
        "@babel/preset-env",
        {
            "modules": false,
            "useBuiltIns": true,
            "targets": {
                "browsers": ["Chrome >= 60"],
                "esmodules": true
            }
        }
    ],
    ["@babel/preset-react"]
]}

How to compile ES6+ code to ES6 with webpack?

1 Answers