vue assets image not load

Question

src/assets/profile.jpg

<v-img src="../assets/profile.png" aspect-ratio="2.75"></v-img>

not load

I do not work. What is the reason?

By the way,

If you specify img tag src, the image will be output.

The extension png is an error. It will not work even if you change it to jpg. — 타오르는선혈
– 타오르는선혈, Commented Jan 21, 2019 at 13:43
Try to use <v-img :src="require('@/assets/profile.jpg')" aspect-ratio="2.75" ></v-img> instead — Jns
– Jns, Commented Jan 21, 2019 at 13:49
Converted my comment to an answer with an explanation (as you asked for) — Jns
– Jns, Commented Jan 21, 2019 at 14:30

Jns · Accepted Answer · 2019-01-21 14:29:08Z

First you have to bind your image path to the src property and then you have to wrap the path in require('@/assets/profile.jpg') to let webpack know that this is a dependency.

So as mentioned as a comment, change your code to this: <v-img :src="require('@/assets/profile.jpg')" aspect-ratio="2.75" ></v-img>

Araoz · Accepted Answer · 2019-03-01 19:31:19Z

This Work for me...

<template> <img :src=logo> </template> <script> export default { data: () => ({ logo: require('@/assets/profile.png') }) } </script>

Collectives™ on Stack Overflow

vue assets image not load

2 Answers 2

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Related