Stenciljs - Background image css path

Question

Im trying to add a background image on my scss file but I could not make it work.

This is the code on my scss file:

  background-image: url('./assets/images/Square.svg');

And when I use my component on my other app this is the path I get:

http://localhost:4200/assets/images/Square.svg

which is not my component path.

I tried to add ‘/dist/collection/assets/images’ but it did not worked

I found this bug report https://github.com/ionic-team/stencil/issues/923 1 but it is closed and it seems that was not fixed.

Answer 1

You can use background:url(data:image/gif;base64,... with base64 image instead of using a relative or absolute url.

Here is a URL for more information https://css-tricks.com/data-uris/