react-markdown 图像未在浏览器中呈现

Question

我在网络应用程序中使用 react-markdown。当我使用 .md 文件加载与 .md 文件存储在同一文件夹中的图像时，我![](image1.jpg)在 Visual Studio 的预览中正确呈现了图像，但在浏览器中却没有 - 相反，我在开发和生产版本中都出现了图像错误。我试过转义 HTML，但这也不起作用。我正在加载一个 .md 页面作为组件，并且所有文本和格式都可以完美运行。

谢谢

Answer 1

我在 Strapi 和 Gatsby 上遇到了同样的问题，观看此视频可能有助于修复图像 URI 以正确加载图像：https ://youtu.be/LIrK5KxsUSE?t=351

这是固定我的：

 <Reactmarkdown
  source={data.strapiArticle.content}
  transformImageUri={uri =>
    uri.startsWith("http") ? uri : `${process.env.REACT_IMAGE_BASE_URL}${uri}`
  }
/>

.env.development 文件：

REACT_IMAGE_BASE_URL =http://localhost:1337