Webpack not converting ES6 to ES5

Solution 1:

If you want to compile ES6 to ES5 you need to install Babel ES2015 preset.

npm install babel-preset-es2015

Then you need to enable this preset. One way to enable this ES6 to ES5 compilation is using babel-loader query string:

  module: {
    loaders: [
      {
        test: /\.js$/,
        loader: 'babel-loader?presets[]=es2015'
      }
    ]
  }

or query option:

  module: {
    loaders: [
      {
        test: /\.js$/,
        loader: 'babel-loader',
        query: {
          presets: ['es2015']
        }
      }
    ]
  }

Solution 2:

babel-preset-es2015 is deprecated. Try:

npm install -D babel-loader @babel/core @babel/preset-env webpack

then in your webpack.config.js :

{
  test: /\.m?js$/,
  exclude: /(node_modules|bower_components)/,
  use: {
    loader: 'babel-loader',
    options: {
      presets: ['@babel/preset-env']
    }
  }
}

more info

Solution 3:

for webpack 3, the module options should look like

module: {
  rules: [
    {
       use: {
          loader:'babel-loader',
          options: { presets: ['es2015'] }
       },
       test: /\.js$/,
       exclude: /node_modules/
    }
  ]
},

this still requires babel-loader and babel-preset-es2015