来自 Laravel-mix (Reactjs & Laravel) 组件的未解析图像路径

Pay*_*yne 2 laravel reactjs laravel-mix

我正在将 reactjs 与 Laravel (Laravel-mix) 一起使用。我在 storage/app/public/images/slider-girl.png 中有我的图像并引用它

 <img src="{require('/images/slider-girl.png')}" />
Run Code Online (Sandbox Code Playgroud)

但不显示图像。

但是,我尝试将图像放在资源和公共文件夹中,但得到了相同的响应。我已经尝试过这里找到的选项,但似乎没有什么对我有用。

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

Run Code Online (Sandbox Code Playgroud)
<img src="{require('/images/slider-girl.png')}" />
Run Code Online (Sandbox Code Playgroud)

我希望显示图像。

小智 5

转到您的 webpack.mix.js,添加

.setResourceRoot("/");
Run Code Online (Sandbox Code Playgroud)

如下图所示

mix.react('resources/js/app.js', 'public/js')
   .sass('resources/sass/app.scss', 'public/css')
   **.setResourceRoot("/");**
Run Code Online (Sandbox Code Playgroud)

然后只需按如下方式引用它:

<img src="/images/slider-girl.png" />
Run Code Online (Sandbox Code Playgroud)

我希望它有帮助