Невозможно добавить изображения в файл MDX в Gatsby

Question

Я пытаюсь импортировать изображение в файл MDX следующим образом: ![alt](image.jpg). Мой файл mdx и изображение хранятся в каталоге sr c, posts, post-1. Однако изображение не отображается. Я пробовал множество путей к файлам, но безуспешно.

Единственный способ получить изображения для отображения - использовать sr c, например, ![alt](/static/47d93fd9bdeaaf54a7b60d14c66abe5d/48e00/icon.jpg)

Ниже приведена часть моего gatsby.config

plugins: [
    {
      resolve: `gatsby-source-filesystem`,
      options: {
        name: `pages`,
        path: `${__dirname}/src/pages/`,
      },
    },
    {
      resolve: "gatsby-source-filesystem",
      options: {
        name: "images",
        path: `${__dirname}/src/images/`,
      },
    },
    {
      resolve: `gatsby-source-filesystem`,
      options: {
        name: `posts`,
        path: `${__dirname}/src/posts/`,
      },
    },
    {
      resolve: `gatsby-source-filesystem`,
      options: {
        name: `post-featured`,
        path: `${__dirname}/src/post-featured/`,
      },
    },
    `gatsby-plugin-sharp`,
    `gatsby-transformer-sharp`,
    {
      resolve: "gatsby-plugin-mdx",
      options: {
        root: __dirname,
        extensions: [".md", ".mdx"],
        gatsbyRemarkPlugins: [
          {
            resolve: "gatsby-remark-images",
            options: {
              maxWidth: 800,
              quality: 70,
            },
          },
        ],
      },
    },

Answer 1

• 1000 , и передать их в MDXRenderer, например: <MDXRenderer images={data.mdx.frontmatter.images}>.

Затем я могу получить доступ к массиву изображений в моем файле mdx следующим образом: <img src={props.images[0].publicURL} style={{ width: "100%" }} />

Answer 2

Я думаю, вам нужно ссылаться на изображения как относительный путь, начинающийся с ./, например ![alt](./image.jpg)

Это не особенно ясно в документации, но упоминается в https://www.gatsbyjs.org/packages/gatsby-remark-images/#usage -in- уценка