ReactJS Webpack: ReferenceError: окно не определено

Question

Я использую webpack в React JS. и вот моя ошибка,

ОШИБКА в ошибке: /Users/prakash/Desktop/projects/limitscale/goal.ly/goaly-react/src:58758 var theme = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)'). соответствует ^ ReferenceError: окно не определено

• src:58758 Object../node_modules/react-ax / dist / index.js/Users/prakash/Desktop/projects/limitscale/goal.ly/goaly-react/src:58758:13

• src: 113496 webpack_require/Users/prakash/Desktop/projects/limitscale/goal.ly/goaly-react/src:113496:42

• src: 38954 Module../node_modules / html-webpack-plugin / lib / loader.js!./ src / index.js/Users/prakash/Desktop/projects/limitscale/goal.ly/goaly-react/src:38954:13

• src: 113496 webpack_require/Users/prakash/Desktop/projects/limitscale/goal.ly/goaly-react/src:113496:42

• src: 113646/Users/prakash/Desktop/projects/limitscale/goal.ly/goaly-react/src:113646:18

• src: 113647/Users/prakash/Desktop/projects/limitscale/goal.ly/goaly-react/src:113647:12

• index.js:321 HtmlWebpackPlugin.evaluateCompilationResult[goaly-react] / [html-webpack-plugin]/index.js:321:28

• index.js:237[goaly-react] / [html-webpack-plugin]/index.js:237:22

• task_queues.js:93 processTicksAndRejection внутренний /process/task_queues.js:93:5

и мой файл конфигурации webpack,

const path = require('path')
const HtmlWebpackPlugin = require('html-webpack-plugin')
const CopyWebpackPlugin = require('copy-webpack-plugin')
const MiniCssExtractPlugin = require('mini-css-extract-plugin');


const ROOT_DIRECTORY = path.join(__dirname, '..')
const SRC_DIRECTORY = path.join(ROOT_DIRECTORY, 'src')
const devMode = process.env.NODE_ENV !== 'production';

const plugins = [];
plugins.push(new HtmlWebpackPlugin({
    template: path.join(SRC_DIRECTORY, '')
  })
  );
plugins.push( new CopyWebpackPlugin({
    patterns: [
        { from: path.join(SRC_DIRECTORY, 'assets'), to: path.join(ROOT_DIRECTORY, 'build') }
    ],
  }));

plugins.push(new MiniCssExtractPlugin())

const config = {
  entry: [path.resolve(__dirname, '../src/index.js')],
  output: {
    globalObject: "this",
    path: path.resolve(__dirname, '../build'),
    // filename: 'bundle.js',
    filename: '[name].[hash:8].js',
    sourceMapFilename: '[name].[hash:8].map',
    chunkFilename: '[id].[hash:8].js',
    publicPath: '/',

  },
  mode: 'development',
  resolve: {
    modules: [path.resolve('node_modules'), 'node_modules'],
    extensions: [".jsx", ".js"]
  },
  performance: {
    hints: false
  },
  plugins: plugins  ,
  module: {
    rules: [
        {
            test: /\.(js|jsx)$/,
            exclude: /node_modules/,
            use: {
              loader: "babel-loader"
            }
          },
          {
            test: /\.html$/,
            use: [
              {
                loader: "html-loader"
              }
            ]
          },
          {
            test: /\.(s*)css$/,
            use: [
                MiniCssExtractPlugin.loader,
                'css-loader',
                'sass-loader'
            ]
        },
      {
        test: /\.(jpe?g|gif|bmp|mp3|mp4|ogg|wav|eot|ttf|woff|woff2|png|svg)$/, 
        use: ['url-loader?limit=10000']
      }
    ]
  }
}

module.exports = config

Что мне делать, чтобы избежать этой ошибки? Столкнувшись с этой проблемой какое-то время. Не могу понять. Есть ли в моем коде ошибка?.Ничего нового в webpack.