Почему после сборки webpack'ом появляется битая картинка?
нашел решение и отказался от file-loader

было:
{
        test: /\.(?:|gif|png|jpg|svg)$/,
        use: [{
          loader: 'file-loader',
          options: {
            name: `./img/${filename('[ext]')}`
          }
        }],
      },

стало:
{
        test: /\.(?:|gif|png|jpg|svg)$/,
        type: 'asset/resource',
        generator: {
          filename: () => {
            return isDev ? 'img/[name][ext]' : 'img/[name].[contenthash][ext]';
          }
        }
      },
const isDev = process.env.NODE_ENV === 'development';
const isProd = !isDev;
const filename = (ext) => isDev ? `[name].${ext}` : `[name].[contenthash].${ext}`;
Твой секрет в этих трёх строчках, оно переименовывает твоё изображение, можешь попробовать сделать вот так:
const filename = (ext) => isDev ? `[name].${ext}` : `[name].${ext}`;