Using an asset as CSS background-image in nuxt

the only way I got it working was too set the asset in a style block and load it that way

I was trying out a few things for this website in nuxt, but it was hard for me to get the asset inline. That I why I did it this way, its not perfect but it works. In your component/page add this:

<style>
    .custom-background-image {
        background-image: url(~/assets/images/bg.jpg);
    }
</style>

After that, just add the class to the correct html element / div for instance

<div class="custom-background-image">
Content of the div here
</div>

by Daniel at 2023-04-02T20:03:19.542Z