Относительный URL-адрес background-image вызывает синтаксическую ошибку - PullRequest
0 голосов
/ 28 апреля 2020

У меня есть angular приложение, которое встроено в существующую веб-страницу. Главная страница запущена в Tomcat на http://<host>/main, а приложение Angular встроено на одну из подстраниц: http://<host>/main/ng#/routing.

Все ресурсы доступны на http://<host>/main/assets/

Я хочу установить background-image для одного из контейнеров, но я не могу найти решение, которое будет работать как для экземпляра dev (начиная с ng serve), так и для сборки дистрибутива (ng build).

  1. Это работает только для экземпляра dev, но после сборки CSS вычисляет его как http://<host>/assets/bg.jpg вместо http://<host>/main/assets/bg.jpg и изображение не найдено.
.container {
    background-image: url("/../assets/bg.jpg");
}
Когда я изменяю background-image с devtools следующим образом:
.container {
    background-image: url("assets/bg.jpg");
}

background начинает ссылаться на действительный URL, но невозможно установить это значение в S CSS, потому что это вызывает CssSyntaxError:

 Can't resolve 'assets/bg.jpg' in '<component-directory>'

Изображения, на которые ссылаются таким образом, работают, но background-image не является:

<img src="assets/bg.jpg"/>
...