Why is React Router not working?

Question

React

Hello! I decided to create a project on React without using create-react-app, setting up webpack.config, got to work, but after creating the routes, I realized that they do not work, or rather, only the root route works (the component is displayed), when switching to any other (it doesn’t matter how) a blank page is displayed.
Googling, I realized that the problem was in setting up webpack, but after trying the suggested options (it didn’t help), I decided to ask for help.
Webpack.config.js:

const path = require("path");
const webpack = require('webpack');
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 OptimizeCssAssetsWebpackPlugin = require("optimize-css-assets-webpack-plugin");
const TerserWebpackPlugin = require("terser-webpack-plugin");
const autoprefixer = require('autoprefixer')
const ImageminPlugin = require("imagemin-webpack-plugin").default;

const isDev = process.env.NODE_ENV === 'development';
console.log(process.env.NODE_ENV);

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

  if (!isDev) {
    config.minimize = true;
    config.minimizer = [
        new TerserWebpackPlugin(),
        new OptimizeCssAssetsWebpackPlugin()
    ]
  }
  return config;
}

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

module.exports = {
  context: path.resolve(__dirname, "src"),
  devtool: isDev ? 'source-map' : false,
  entry: {
    main: ["@babel/polyfill", "./index.js"]
  },
  output: {
    path: path.resolve(__dirname, "dist"),
    publicPath: "/",  // при указании другого (я пробовал /src/ и /dist/) появляется ошибка cannot get pathName
    filename: filename('js')
  },
  resolve: {
    extensions: ['.js', '.json']
  },
  optimization: optimization(),
  devServer: {
    inline: true,
    port: 3000,
    historyApiFallback: true // большинству помогала эта строка, мне, к сожалению, нет
  },
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        use: {
          loader: "babel-loader"
        },
      },
      {
        test: /\.(sa|sc|c)ss$/,
        use: [
          {
            loader: MiniCssExtractPlugin.loader,
            options: {
              hmr: isDev,
              reloadAll: true
            }
          },
          {
            loader: 'css-loader'
          },
          {
            loader: 'postcss-loader',
            options: {
              plugins: [
                autoprefixer
              ]
            }
          },
          {
            loader: 'sass-loader'
          },
        ]
      },
      {
        test: /\.(png|jpe?g|gif|svg|ttf|woff|woff2|eot)$/,
        use: ["file-loader"]
      }
    ]
  },
  plugins: [
    new HtmlWebpackPlugin({
      template: "./index.html",
      minify: {
        collapseWhitespace: !isDev
      }
    }),
    new CleanWebpackPlugin(),
    new CopyWebpackPlugin({
      patterns: [
        {
          from: path.resolve(__dirname, "src/assets/images"),
          to: path.resolve(__dirname, "dist/image")
        }
      ]
    }),
    new MiniCssExtractPlugin({
      filename: filename('css')
    }),
    new webpack.DefinePlugin({
      'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV)
    }),
    new ImageminPlugin({
      test: /\.(png|jpe?g|gif|svg)$/,
      disable: isDev,
      pngquant: {
        quality: '95-100'
      }
    })
  ]
};

Just in case, routes:

class App extends Component {
    render() {
        return (
            <div className="d-flex align-items-center justify-content-center">
                <Switch>
                    <Redirect from='/' to='/authorization' />
                    <Route exact path='/authorization' component={Login} />
                </Switch>
            </div>
        );
    }
}

export default App;

So how to solve this problem if the popular methods do not help?
Thanks in advance for any help!
PS: Edits and comments on setting up webpack are welcome, thanks)

Answer 1

I found what the problem is, everything breaks because of this line:
<Redirect from='/' to='/authorization' />
Correct:

<Route exact path='/'><Redirect to='/authorization'/></Route>