image - 来自 Markdown 元数据或 frontmatter 的 NextJs 图像

Question

我需要加载来自 Markdown 元数据的图像

---
title: 'First Blog'
description: 'First blog description'
image: ../../common/src/assets/image/image.png
author: 'Stack'
---

当我将它传递给我的代码并检查浏览器时，图像 src 就是下面的路径。它没有像往常一样为其他图像转换为静态/...

<img src={post.frontmatter.image} />

如何在不使用 next-images 等插件的情况下修复此问题。感谢您的帮助

Answer 1

Nextjs 可以在您的根目录中名为 public 的文件夹下提供图像。在您的根目录中添加一个文件夹，将其称为“public”并将您的 Assets 添加到其中

示例:

public
--common
----src
------assets
--------image
----------image.png

---
image: "/common/src/assets/image/image.png"
---

---
<img src={post.frontmatter.image} />
---

Nextjs 会为您处理剩下的事情。更多关于 Static File Serving