In Angular .css files url(/assets/mypic.png) files no longer working in build after v17=>v19

I updated Angular v17=>v18=>v19 recently. File references in my.component.css à la background-image:url(/assets/mypic.png) are no longer working.

component.html

<img src="assets/picture.png" /> OK
<span style="background-image:url(assets/picture.png)">_</span> OK
<span class="bgImageFromCssFile">_</span> FAILS


Only the first two lines display an image.

component.css

.bgImageFromCssFile { background-image:url(/assets/picture.png) }


This worked for years now, including Angular v17. And it still works fine for ng serve. It's only broken in builds.

My Angular app is installed in server.com/apppath/ng/. Since v18/19 ONLY the path in component.css translates to server.com/assets/picture.png in the browser the other two correctly to server.com/apppath/ng/assets/picture.png

For assets/picture.png or ../assets/picture.png in the .css the compiler returns an error: "Could not resolve ..."

If file references work for .html there should be a way to reference the same file from .css, too no?

Continue reading...