Почему не работает React Router?

Question

[Incold]

Здравствуйте! Решил создать проект на React не используя create-react-app, настроив webpack.config, приступил к работе, но создав роуты, понял, что они не работают, вернее срабатывает (отображается компонента) только корневой роут, при переходе на любой другой (неважно каким способом) отображается пустая страница.
Погуглив, понял, что проблема в настройке webpack, но испробовав предложенные варианты (не помогло), решил обратиться за помощью.
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'
      }
    })
  ]
};

На всякий случай, роуты:

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;

Так как же решить эту проблему, если популярные способы не помогают?
Заранее, спасибо, за любую помощь!
P.S. : Правки и замечания по настройке webpack, приветствуются, спасибо)

Comments

[Daniil]

Лучше выложи в песочницу, так тебе проще будет подсказать
С кра работает? Ошибки какие в консоли? Мало инфы

[Incold]

TchernyavskD, в консоли иногда появляется ошибка 'Failed to load resourse 404', но не всегда (поэтому без скринов), бывает перезагружу страницу ошибка пропадёт, иногда после запуска вообще ошибок нет.
Я уверен, что ошибка в настройке webpack, только, не понимаю, как правильно её выполнить

Answer 1

[Incold]

Нашёл в чём проблема, всё ломается из-за этой строчки:
<Redirect from='/' to='/authorization' />
Правильно:

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