【发布时间】：2026-02-06 22:05:02
【问题描述】：
- 此问题似乎与 webpack 配置有关，因为当我们提供 webpack 时，会为开发环境创建捆绑/虚拟副本，并且由于不存在图像，因此其显示损坏的图标。
- 我无法访问 react 组件中公用文件夹中的图像。
- 我现有的 React 应用程序现已与 webpack 集成，除图像外一切正常。
我想使用 url 而不是 import 语句来使用图像。
预期方式：<img src={"/images/logo.png"} alt="logo" className={classes.logo} />
不是预期的： import logo from '../../../public/images/logo.png'
以下是我的应用程序结构， 请让我知道用于开发和生产环境的加载器或配置或任何更好的方法？
这是我用于开发的 webpack 配置。
提前致谢 :)
【问题讨论】：
-
据我所知，您正在正确设置图像
src属性。有什么问题？ -
@DrewReese 当我们为 webpack 应用程序提供服务时，它会创建包的虚拟副本，并且该包中不存在图像。这就是它显示损坏图像的原因。
-
那么图像不是位于“public/images”中吗？或者这是 some webpack 问题，我们需要查看您的代码/配置在做什么？
标签： javascript reactjs webpack webpack-dev-server