How to fix the error: "TypeError: Cannot read property 'getFormatter' of undefined"?

Question

webpack

When using eslint, it constantly throws an error: "TypeError: Cannot read property 'getFormatter' of undefined".
It is duplicated 3 times (this is due to the fact that I have 3 js files in my project).
Already googled a bunch of times, but I did not find a specific solution.

Tell me, please, what could be the reason?
Here is the assembly code:

{
  "name": "artsite",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "dependencies": {
    "@babel/eslint-parser": "^7.15.8",
    "@babel/polyfill": "^7.12.1",
    "http-server": "^13.0.2",
    "jquery": "^3.6.0",
    "normalize.css": "^8.0.1",
    "webpack": "^5.58.1",
    "webpack-cli": "^4.9.0"
  },
  "devDependencies": {
    "@babel/core": "^7.15.8",
    "@babel/plugin-proposal-class-properties": "^7.14.5",
    "@babel/preset-env": "^7.15.8",
    "babel-loader": "^8.2.2",
    "clean-webpack-plugin": "^4.0.0",
    "copy-webpack-plugin": "^9.0.1",
    "cross-env": "^7.0.3",
    "css-loader": "^6.3.0",
    "eslint": "^8.0.1",
    "eslint-loader": "^4.0.2",
    "eslint-webpack-plugin": "^3.0.1",
    "file-loader": "^6.2.0",
    "html-webpack-plugin": "^5.3.2",
    "mini-css-extract-plugin": "^2.4.2",
    "node-scss": "^7.0.3",
    "optimize-css-assets-webpack-plugin": "^6.0.1",
    "sass": "^1.42.1",
    "sass-loader": "^12.1.0",
    "style-loader": "^3.3.0",
    "terser-webpack-plugin": "^5.2.4"
  },
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "dev": "cross-env NODE_ENV=development webpack --mode development",
    "prod": "cross-env NODE_ENV=production webpack --mode production"
  },
  "browserslist": "> 0.25%, not dead",
  "author": "",
  "license": "ISC"
}

const path = require('path')
const HtmlWebpackPlugin = require('html-webpack-plugin')
const { CleanWebpackPlugin } = require('clean-webpack-plugin')
const CopyWebpackPlugin = require('copy-webpack-plugin')
const MiniCssExtractPlugin = require('mini-css-extract-plugin')
const { config } = require('process')
const optimizationCssAssetPlugin = require('optimize-css-assets-webpack-plugin')
const terserWebpackPlugin = require('terser-webpack-plugin');

const isDev = process.env.NODE_ENV === 'development'
const isProd = !isDev

const optimization = () => {
    const config = {
        splitChunks: {
            chunks: 'all'
        }
    }

    if (isProd) {
        config.minimizer = [
            new optimizationCssAssetPlugin(),
            new terserWebpackPlugin()
        ]
    }

    return config
}

const babelOptions = preset => {
    const opts = {
        presets: [
            '@babel/preset-env'
        ],
        plugins: [
            '@babel/plugin-proposal-class-properties'
        ]
    }

    if (preset) {
        opts.presets.push(preset)
    }

    return opts
}

const jsLoaders = () => {
    const loaders = [{
        loader: 'babel-loader',
        options: babelOptions()
    }]

    if (isDev) {
        loaders.push('eslint-loader')
    }

    return loaders
}


const filename = ext => isDev ? `[name].${ext}` : `[name].[hash].${ext}`

module.exports = {
    context: path.resolve(__dirname, 'src'),
    entry: {
        index: ['@babel/polyfill', '@mainJS/index.js'],
        main: '@mainJS/main.js',
        scrtipt: '@mainJS/script.js'
    },

    output: {
        filename: filename('js'),
        path: path.resolve(__dirname, 'dist'),
    },

    plugins: [

        // HTML plagin
        new HtmlWebpackPlugin({
            filename: "index.html",
            template: './main.html',
            chunks: ['scrtipt'],
            minify: {
                collapseWhitespace: isProd,
            },
        }),

        new HtmlWebpackPlugin({
            filename: "test.html",
            template: './test.html',
            chunks: ['scrtipt', 'main', 'index'],
            minify: {
                collapseWhitespace: isProd,
            }
        }),

        // CLEAN plagin
        new CleanWebpackPlugin(),

        // COPY plagin
        new CopyWebpackPlugin({
            patterns: [
                {
                    from: path.resolve(__dirname, 'img'),
                    to: path.resolve(__dirname, 'dist')
                },
            ]
        }),

        new MiniCssExtractPlugin({
            filename: filename('css')
        })

    ],

    resolve: {
        alias: {
            '@mainJS': path.resolve(__dirname, './src/js')
        }
    },

    optimization: optimization(),

    module: {
        rules: [
            // Loading FONT-FAMILY
            {
                test: /\.(woff(2)?|ttf|eot|svg)(\?v=\d+\.\d+\.\d+)?$/,
                use: ['file-loader']
            },
            // Loading SCSS/SASS
            {
                test: /.s[ac]ss$/i,
                exclude: /node_modules/,
                use: ['style-loader', 'css-loader', 'sass-loader',],
            },

            // Loading CSS
            {
                test: /\.css$/,
                use:
                    [
                        {
                            loader: MiniCssExtractPlugin.loader,
                            options: {},
                        },
                        'css-loader'
                    ],
            },
            // Loading BABEL
            {
                test: /\.m?js$/,
                exclude: /(node_modules|bower_components)/,
                use: jsLoaders(),
            }
        ]
    }
};