当部署到 gh-pages 时，React 不显示放置在公共文件夹中的图像，但在本地主机上工作

Question

我构建了一个简单的应用程序，它呈现三张卡片，这些卡片包含 React 的公共文件夹中的图像。它可以工作，localhost:3000但是当我试图将它部署到 GitHub 时，gh-pages 图像会中断。它似乎没有从公用文件夹中获取图像。我遵循的部署到 gh-pages 的步骤：在 package.json 中为主页创建了一个键值对，并在脚本部分添加了这两行"predeploy":"npm run build", "deploy":"gh-pages -d build",npm install gh-pages --save-dev提交并推送所有上述更改npm run deploy这 4 个步骤成功部署了我的应用程序https://sandeep194920.github.io/CompoundComponents/但是，如您所见，图像不会显示在本地主机中。让我知道我在这里犯的错误是什么。谢谢。

Answer 1

生成的 HTML 将像这样链接到图像

<p><img alt="" src="/img/image.png" /></p>

但图像实际上会在这里。

所以这个问题可以通过使用相对路径来避免，如果它是一个绝对路径，那么如果存储库名称应该自动添加到图像 URL 之前是值得的。

可以尝试以下方法：



<img src="./img/image.svg" />

<img src="img/image.svg" />

我试过了，为我工作