javascript - syntax error on arrow functions in IE11 when using webpack

Question

I am using webpack to compile my existing javascript code for different browsers. You can find my current config below. When I load the bundle that is generated in IE11 I get a SCRIPT1002: Syntax error on a line whith an arrow function. Do any of you see something I can change to my config to make it work in IE11?

• Package.json

"devDependencies": {
    "@babel/cli": "^7.12.10",
    "@babel/core": "^7.12.10",
    "@babel/node": "^7.12.10",
    "@babel/polyfill": "^7.12.1",
    "@babel/preset-env": "^7.12.11",
    "@babel/register": "^7.12.10",
    "glob": "^7.1.6",
    "webpack": "^4.46.0",
    "webpack-cli": "^3.3.12",
    "webpack-dev-server": "^3.11.2"
  },
  "dependencies": {
    "babel-loader": "^8.2.2"
  }

• webpack.config.js

const path = require('path');
const glob = require('glob');

require('@babel/register');

//webpack config
const config = [
  {
    entry: glob.sync('../../source/images/src/js/global.js'),
    mode: 'development',
    output: {
      path: path.resolve(__dirname, './../../source/images/build/js/'),
      filename: 'client.bundle.js'
    },
    module: {
      rules: [
        {
          test: /.js?$/,
          exclude: /node_modules/,
          use: ['babel-loader']
        }
      ]
    }
  },
  {
    entry: glob.sync('../../source/images/src/js/global.js'),
    devtool: 'none',
    mode: 'production',
    output: {
      path: path.resolve( __dirname, './../../source/images/build/js/'),
      filename: 'client.bundle.min.js'
    },
    module: {
      rules: [
        {
          test: /.js?$/,
          exclude: /node_modules/,
          use: ['babel-loader']
        }]
    }
  }
]
module.exports = config;

• .babelrc

{
  "presets": [
    ["@babel/preset-env", {
      "debug": true,
      "useBuiltIns": "usage",
      "corejs": "7.7.0"
    }]
  ]
}

• .browserslistrc

not ie <= 9
> 0.25%

question from:https://stackoverflow.com/questions/65845233/syntax-error-on-arrow-functions-in-ie11-when-using-webpack

Answer 1

Waitting for answers