text: const path = require('path');
  const HtmlWebpackPlugin = require('html-webpack-plugin');
  const Dotenv = require('dotenv-webpack');
  
  const isProduction = process.env.NODE_ENV == 'production';
  
  const stylesHandler = 'style-loader';
  
  const config = {
      entry: './src/index.js',
      output: {
          path: path.resolve(__dirname, 'dist'),
          publicPath: '/'
      },
      devServer: {
          open: true,
          host: 'localhost',
          historyApiFallback: true,
          port: 8080,
      },
      module: {
          rules: [
              {
                  test: /\.(js|jsx)$/i,
                  loader: 'babel-loader',
              },
              {
                  test: /\.css$/i,
                  use: [stylesHandler, 'css-loader'],
              },
              {
                  test: /\.(eot|svg|ttf|woff|woff2|png|jpg|gif)$/i,
                  type: 'asset',
              },
          ],
      },
      resolve: {
          extensions: ['.js', '.jsx'],
      },
      plugins: [
          new HtmlWebpackPlugin({
              template: "./public/index.html",
              filename: "./index.html",
          }),
          new Dotenv({
              path: './.env',
          }),
      ]
  };
  
  module.exports = () => {
      if (isProduction) {
          config.mode = 'production';
      } else {
          config.mode = 'development';
      }
      return config;
  };
  