Unresolved image path from the component in Laravel-mix (Reactjs & Laravel)

Question

I am using reactjs with the Laravel (Laravel-mix). I have my image in storage/app/public/images/slider-girl.png and referenced it on

 <img src="{require('/images/slider-girl.png')}" />

but not displaying the image.

However, I have tried to put the image in resources and public folder and I get the same response. I have tried options found here but nothing seems to work for me.

<img src={url('storage/app/public/images/slider-girl.png')} />

<img src="{require('/images/slider-girl.png')}" />

I expect the image be displayed.

Abdulkabir Ojulari · Accepted Answer · 2019-03-28 16:25:09Z

7

Go to your webpack.mix.js, add

.setResourceRoot("/");

as illustrated below

mix.react('resources/js/app.js', 'public/js')
   .sass('resources/sass/app.scss', 'public/css')
   **.setResourceRoot("/");**

Then just reference it as follows:

<img src="/images/slider-girl.png" />

I hope it helps

answered Mar 28, 2019 at 16:25

Abdulkabir Ojulari

1,4679 silver badges14 bronze badges

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

Collectives™ on Stack Overflow

Unresolved image path from the component in Laravel-mix (Reactjs & Laravel)

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