Неразрешенный путь к изображению из компонента в Laravel-mix (Reactjs

#reactjs #laravel #laravel-mix

#reactjs #laravel #laravel-mix

Вопрос:

Я использую reactjs с Laravel (Laravel-mix). У меня есть мое изображение в хранилище / app / public / images / slider-girl.png, и я ссылался на него на

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

но изображение не отображается.

Однако я попытался поместить изображение в ресурсы и общую папку, и я получаю тот же ответ. Я пробовал варианты, найденные здесь, но, похоже, у меня ничего не работает.

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

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

Я ожидаю, что изображение будет отображено.

Ответ №1:

Перейдите к своему webpack.mix.js , добавить

 .setResourceRoot("/");
  

как показано ниже

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

Затем просто ссылайтесь на него следующим образом:

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

Я надеюсь, что это поможет