cant use local image as src laravel-mix vuejs

Question

I have a Vue component located at resources/js/modules/MyComponent.vue and inside it, I'm trying to use a local image as an src for the img tag, and the image is located at public/assets/myproj/image/myimage.png.

I've tried using the following :

<img src="@/assets/myproj/image/myimage.png"/>
<img src="require('assets/myproj/image/myimage.png')"/>
<img src="../../../public/assets/myproj/image/myimage.png"/>
<img src="/assets/myproj/image/myimage.png"/>

but none of them work...

I know this is a straightforward question but I hope someone can help me because I've been trying to find an answer for almost an hour now but I still can't figure it out.

okay nvm i got it, imported the image instead using relative path — modi
– modi, Commented Feb 9, 2021 at 19:24

Dharman · Accepted Answer · 2021-02-09 21:42:00Z

1

If you want to use this in javascript you can do like this

<img :src='getImage(name)'/>

then you will need to import your image in your javascript code

getImage(name){
 return require(`@/assets/myproj/${name}`);
}

edited Feb 9, 2021 at 21:42

Dharman♦

33.9k27 gold badges106 silver badges157 bronze badges

answered Feb 9, 2021 at 21:36

Vanishdark

1701 silver badge11 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

cant use local image as src laravel-mix vuejs

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related