Как использовать введенную строку как часть пути в URL-адресе в CSS (в Angular) ⇐ CSS

[Anonymous]

У меня есть библиотека, которая позволяет вам вводить значение base-href для вашего конкретного приложения, чтобы к ресурсам библиотеки (которые вы размещаете в качестве зависимости npm в своем приложении) можно было получить доступ без прокси. В большинстве случаев это работает, но я не могу понять, как использовать для этого введенное значение в CSS:
$fonts: '#{}/fonts';

@font-face {
font-family: 'Roboto';
font-style: normal;
font-weight: 300;
src: local('Roboto Light'), local('Roboto-Light'),
url('#{$fonts}/roboto-v18-greek-ext_cyrillic-ext_latin-ext-300.woff2') format('woff2'),
url('#{$fonts}/roboto-v18-greek-ext_cyrillic-ext_latin-ext-300.woff') format('woff');
}

Проблема в том, что URL-адрес должен быть разрешен во время сборки, поэтому этот код не скомпилируется.
2 примечания:

• Я использую Angular с токенами внедрения.
• В моем случае , в файле scss я попробовал $fonts: '#{var(--asset-base-path)}/fonts'; и в файле компонент.ts я попробовал:

@HostBinding('style.--asset-base-path') assetBasePath = '';

constructor(@Inject(LIB_ASSET_BASE_PATH) path: string) {
this.assetBasePath = path
}


Подробнее здесь: https://stackoverflow.com/questions/790 ... -in-angula