[Vuejs]-Images don't show in Components in VueJS

by

0👍

✅

It depends where you are keeping your images. In your case use require with src path (@):

plats: [
    {
      name: "Steak de boeuf",
      price: 5.99,
      url: require('@/assets/steak.jpg')
    }
]

0👍

As said by Albert in the comment, you have at least two ways to load images: removing the slash (e.g., assets/foo.jpg) or, better, link them by just adding a @ before the relative path like: @/assets/foo.jpg; in short, ~ loads the /node_modules/ relative path, for example if you want to link Bootstrap, while @ stands for /src/.

0👍

That’s because expression inside v-bind are executed in runtime, webpack aliases work in compile time.

Try wrapping your url in require like this:

{name: "Steak de boeuf", price: 5.99, url: require("assets/steak.jpg")}

Leave a comment