Разрешение абсолютных путей из CSS с помощью Webpack

Question

У меня есть проект, в который я импортирую правила CSS из node_modules. У них есть пути к клипам с абсолютными URL-адресами, поэтому они не работают с текущей настройкой.

Я пытаюсь разрешить его с помощью Webpack, потому что он обычно работает для всех изображений.

Мой веб-пакет настроен:

{
  test: /\.(css|scss)?$/,
  use:  ['style-loader', MiniCssExtractPlugin.loader, 'css-loader', 'postcss-loader', 'sass-loader']
},
{
  test: /\.(svg|png|jpg|eot|woff|woff2)?$/,
  include: [
       path.resolve(basePath, 'project/frontend/scss'),
  ],
  use: {
  loader: "file-loader",
  options: {
  name: '[name].[ext]',
  outputPath: 'assets/fonts/'
   }
}

У меня есть таблица стилей, которая содержит этот стиль (из node_modules):

.background {
   background: url('/img/image.svg');
   font-color: '#cecece';
} 

Стили добавляются в HTML, а font-colour применяется. Однако стиль не может разрешить путь, потому что после импорта стилей по какой-то причине он не может найти изображение в своем подмодуле, поэтому другой вариант - сделать его относительным и позволить ему найти его:

.background {
   background: url('./img/image.svg');
}

Но я не могу решить эту проблему с помощью конфигурации моего веб-пакета. Я попробовал это, потому что у меня есть подмодуль, который содержит изображения (и стили). Намерение состоит в том, чтобы использовать для разработки небольшую концепцию другого приложения.

Но я не могу понять, как отобразить пути к изображениям, и я не хотел бы разрешать все пути к изображениям из первоначального проекта, если смогу избежать этого.

Это не дает никакой ошибки, но просто не разрешает путь '/img/image.svg'.

Я перепробовал несколько решений, но все они безуспешно. Итак, я хотел бы знать, есть ли какая-то идея или решение, которое я пропускаю.