Webpack not serving js files to browser UPDATE: website runs in Safari but not Chrome?

The bundle.js file in the browser contains the index.html code, while in node it has the correct javascript code. Any idea why this is? NOTE: this wasn't always the case, older versions of my project still workand the webpack configuration is exactly the same.

EXPECTED behavior:

ACTUAL behavior:

• webpack.config.js

const path = require('path');
const Dotenv = require('dotenv-webpack');

const clientConfig = {
  mode: 'development',
  entry: {
    path: path.join(__dirname, './client/src/index.js')
  },
  output: {
    path: path.join(__dirname, './client/dist'),
    filename: 'bundle.js'
  },
  devServer: {
    historyApiFallback: true
  },
  module: {
    rules: [
      {
        test: /\.(js|jsx)$/,
        exclude: /nodeModules/,
        loader: 'babel-loader'
      },
      {
        test: /\.(css|scss)$/,
        use: ['style-loader', 'css-loader', 'sass-loader']
      },
      {
        test: /\.(png|pdf)$/,
        loader: 'file-loader'
      }
    ]
  },
  plugins: [
    new Dotenv({systemvars: true})
  ]
}

module.exports = clientConfig;

• file structure (all relevant files)

  -- root 
  |      \
  |       -- client
  |                \
  |                 -- dist
  |                |       \
  |                |        -- index.html
  |                |        -- scss
  |                |               \
  |                |                -- index.scss
  |                \              ...
  |                 -- src
  |                       \
  |                        -- index.js
  |                        -- components
  |                                     \
  |                                      -- App.js 
  |                                      ...  
  -- webpack.config.js      

• bundle.js in node
  

UPDATE: website runs in Safari but not Chrome???

None of my projects were running on the chrome browser. Whenever I had to run something with webpack I would recieve this error message

Webpack error bundle.js:1 Uncaught SyntaxError: Unexpected token <

However, my projects would work just fine in the Safari browser.
After a quick Google search I stumbled across this article
https://kinsta.com/knowledgebase/this-site-cant-be-reached/#:~:text=Clear%20Your%20Browser%20Cache&text=To%20solve%20that%20issue%2C%20you,to%20clear%20your%20browser%20cache.&text=Clearing%20cached%20images%20and%20files,was%20giving%20you%20problems%20earlier.

I decided to wing it and I cleared my browser's cache of all data and cookies from the past 24 hours.

The error is gone and my sites work now.

I'm not entirely sure what happened but the issue is resolved. If anyone wants to contribute or elaborate fell free to do so.