Keep folder structure the same in output for Asset Modules in Webpack v5

Question

My folder structure is below.

I am using WordPress and my setup looks different from the usual setup. I am new and took what I was using from another developer and tweaking it. I also do not have an index.js file at all.

├── src
│   └── themes
│       └── someThemeName
│           ├── images
│           │   └── header
│           │       └── header.jpg
│           └── fonts
├── public_html
│   └── wp-content
│      └── themes
│          └── someThemeName
│             ├── images
│             │   └── header
│             │       └── header.jpg
│             └── fonts
│  
├── package-lock.json
├── package.json
└── webpack.config.js

How do I update assetModuleFilename?

webpack.config.js

const fs = require('fs');
const {
  resolve
} = require('path');
const svgToMiniDataURI = require('mini-svg-data-uri');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');

let entries = {};
const theme = process.env.npm_config_theme;
const paths = {
  ['themes/' + theme + '/style']: './src/themes/' + theme + '/scss/style.scss',
  ['themes/' + theme + '/js/additions']: './src/themes/' + theme + '/js/additions.js'
};

for (var key in paths) {
  if (fs.existsSync(paths[key])) {
    entries[key] = paths[key]
  }
}

module.exports = {
  entry: entries,
  output: {
    path: resolve('./public_html/wp-content/'),
    assetModuleFilename: (pathData) => {
      const filepath = path.dirname(pathData.filename).split('/').slice(1).join('/');
      return filepath + '/[name][ext]';
    }
  },
  resolve: {
    extensions: ['.js', '.scss'],
    modules: [
      resolve('src'),
      'node_modules',
    ],
    alias: {
      'themes': resolve('./src/themes')
    }
  },
  plugins: [
    new MiniCssExtractPlugin({
      filename: '[name].css'
    })
  ],
  module: {
    rules: [
      {
        test: /\.(jpe?g|png|gif|woff|woff2|eot|ttf|otf)$/i,
        type: "asset/resource"
      },
      {
        test: /\.svg/,
        type: 'asset/inline',
        generator: {
          dataUrl: content => {
            content = content.toString();
            return svgToMiniDataURI(content);
          }
        }
      },
      {
        test: /\.js$/,
        exclude: [/public_html/, /node_modules/],
        use: ['babel-loader']
      },
      {
        test: /\.scss$/,
        exclude: /public_html/,
        use: [MiniCssExtractPlugin.loader, 'css-loader', 'postcss-loader', 'sass-loader']
      }
    ]
  }
};

I tried to use the code in the link below but I keep getting

Error: Conflict: Multiple chunks emit assets to the same filename undefined (chunks 375 and 375)

Webpack 5 Assets Module: How to keep the folder structure in the output folder?