Home

Issue: 2123

Using CSS inlined style to import images

[issue link]

I have searched throughout the issues in Nuxt and Next and found no solution to importing images directly in the vue <template>.

Here is what I am trying to do:

<template lang="html">
    <div class="background" :style="{ backgroundImage: `url(${backgroundUrl})` }">
</template>

Basically this component needs to accept a prop of backgroundUrl and needs to be inline styled so that I can use this component on different pages with different backgrounds.

Thoughts?

EDIT: One way that I can think of is add the images into the static folder and call the directly, but I’m not sure that’s the best way to approach this since I want all my images to be in one folder assets/images.

This question is available on Nuxt.js community (#c1883)