Как создать URL-адрес фонового изображения, используя переменную CSS в файле SCSS. Angular ⇐ CSS

[Anonymous]

В приложении Angular + Single-Spa требуется создать URL-адрес изображения в файле SCSS с использованием переменной CSS.
Текущая реализация:

Код: Выделить всё

.image {
content: '';
background-image: url('/assets/images/edit.svg');
width: 12px;
height: 6px;
cursor: pointer;
}

Он загружается как http://localhost:4200/assets/images/edit.svg — приложение SHELL, работающее в 4200. Это изображение выдает 404, когда приложение интегрировано с Приложение SHELL для одного спа. Итак, получаем 404.
На самом деле ожидается http://localhost:4300/assets/images/edit.svg
Так что пытаемся чтобы установить префикс фактического пути MFE.
Например:

Код: Выделить всё

: root {
--mfe-path: htt://localhost:4300/
}

.image {
content: '';
// background-image: url("var(--mfe-path, '')}/assets/images/edit.svg"); - option 1
// background-image: url("#{var(--mfe-path, '')}/assets/images/edit.svg"); - option 2
background-image: url(var(--mfe-path) + '/assets/images/edit.svg'); - option 3
width: 12px;
height: 6px;
cursor: pointer;
}

Попробовал дополнительную конфигурацию веб-пакета, также связанную с этим. Ничего не получается

Подробнее здесь: https://stackoverflow.com/questions/793 ... le-angular