How to compile under IE11?

Question

React

I updated babel from version 6 to version 7, the functionality was lost somewhere. The last time I checked the assembly under IE 11 in April - it worked there. Since then, he moved from axios to superagent, now ie11 swears at arrow functions in his code. I do not understand why the collector does not remove them. The second day I dig - results 0. I took typical configs. Previously, Babel's config was in a webpack, I moved it to a separate one, because. when switching to the 7th version, everything still fell off. I really don't want to go back.
babel.config.js

module.exports = function (api) {
  api.cache(true)

  const plugins = ['@babel/plugin-transform-runtime', '@babel/plugin-proposal-class-properties', '@babel/plugin-transform-arrow-functions']

  return {
    presets: [
      [
        '@babel/env',
        {
          targets: {
            ie: '7',
          },
          useBuiltIns: 'usage',
          corejs: 3,
        },
      ],
      ['@babel/preset-react'],
    ],
    plugins,
  }
}

/* global __dirname */


const path = require('path')
const webpack = require('webpack')
const CopyWebpackPlugin = require('copy-webpack-plugin')
const TerserPlugin = require('terser-webpack-plugin')

const dirJs = path.resolve(__dirname, 'src')
const dirHtml = path.resolve(__dirname, 'html')
const dirBuild = path.resolve(__dirname, 'build')
const dirCss = path.resolve(__dirname, 'css/styles.css')
const dirImg = path.resolve(__dirname, 'img')

module.exports = {
  mode: 'production',
  entry: ['./src/index.jsx'],

  watch: true,

  performance: {
    hints: 'warning',
  },

  devServer: {
    contentBase: dirBuild,
  },

  plugins: [
    new CopyWebpackPlugin([
      { from: dirHtml },
      { from: dirCss },
      { from: dirImg, to: './img/' },
    ]),
    new webpack.NoEmitOnErrorsPlugin(),

  ],

  module: {
    rules: [
      {
        test: /\.(js|jsx)$/,
        exclude: /node_modules/,
        loader: 'babel-loader',
      },
      {
        test: /\.css$/,
        loaders: [
          'style-loader?sourceMap',
          'css-loader?modules&importLoaders=1&localIdentName=[path]___[name]__[local]___[hash:base64:5]',
        ],
      },
      {
        loader: 'file-loader',
        options: {
          outputPath: './img/',
        },
        test: /\.svg$/,
      },
    ],
  },

  optimization: {
    minimizer: [
      new TerserPlugin({
        terserOptions: {
          output: {
            comments: false,
          },
        },
      }),
    ],
  },
  stats: {
    // Nice colored output
    colors: true,
  },
  resolve: {
    extensions: ['.js', '.jsx'],
  },

  output: {
    path: dirBuild,
    filename: 'bundle.js',
  },
  // Create Sourcemaps for the bundle
  devtool: 'none',
}

I don’t know where to dig anymore :(
In ej and above, everything works fine.

Answer 1

The latest version of superagent does not contain arrow functions in the code.
If you have problematic packages in your dependencies that need to be transpiled, then you can exclude them from exclude with a regular expression:

test: /\.(js|jsx)$/,
exclude: /node_modules\/(?!(trouble-package-name|other-thouble-package-name)\/).*/,