Webpack file-loader gives wrong path?

Question

JavaScript

There is a config with such settings for images and for less files.

{
      test: /\.(jpe?g|png|gif|svg)$/,
      use: [
        {
          loader: 'file-loader',
          options: {
            name: "[name].[ext]",
            outputPath: "img"
          }
        },
        {
          loader: 'image-webpack-loader',
          options: {
            mozjpeg: {
              progressive: true,
              quality: 65
            },
            optipng: {
              enabled: false,
            },
            pngquant: {
              quality: '65-90',
              speed: 4
            },
            gifsicle: {
              interlaced: false,
            },
            svgo: {
              enabled: false,
            }
          }
        }
      ]
    },
    {
      test: /\.less$/,
      use: [
        {
        	loader: 'style-loader',
        },
        {
        	loader: MiniCssExtractPlugin.loader,
        }, 
        {
        	loader: "css-loader",
        	options: {
        		sourceMap: true,
        	}
        },
        {
        	loader: "postcss-loader",
        	options: {
        		sourceMap: true,
        		config:  {
        			path: 'postcss.config.js',
        		}
        	}
        },
        {
        	loader: "less-loader",
        	options: {
            relativeUrls: false,
        		sourceMap: true,
        	}
        }
      ]
    },

The problem is that when you try to add a background image to less, an error occurs related to the paths.
How do I include files in index.js

import mainbg from './img/backgrounds/main-bg.svg';

How do I add background to less

.main-page {
    background-image: url('./img/main-bg.svg');
    background-color: #172F6C;
}

Here is the error itself:

ERROR in ./src/less/styles.less (./node_modules/css-loader/dist/cjs.js??ref--6-2!./node_modules/postcss-loader/src??ref--6- 3!./node_modules/less-loader/dist/cjs.js??ref--6-4!./src/less/styles.less)
Module not found: Error: Can't resolve './img/main -bg.svg' in 'C:\Users\Lenovo\Desktop\Loot Gamble\src\less'
@ ./src/less/styles.less (./node_modules/css-loader/dist/cjs.js??ref --6-2!./node_modules/postcss-loader/src??ref--6-3!./node_modules/less-loader/dist/cjs.js??ref--6-4!./src/ less/styles.less) 4:41-69

UPD:
I also tried to use url-loader, but again, the same error.