小编pdo*_*zal的帖子

最近我开始使用 Gatsby，现在我正在尝试使用 MDX，在我的 MDX 文件中，我可以通过 GraphQL 使用 Gatsby 图像，但我想使用 gatsby-plugin-image 中的静态图像，但出现错误像这样：

react_devtools_backend.js:2557 图像未加载 https://images.unsplash.com/photo-1597305877032-0668b3c6413a?w=1300

当我尝试在 .tsx 中实现此图像时，它可以工作，所以我想知道它是否可能。

gatsby 配置

 "gatsby-remark-images",
    {
      resolve: "gatsby-plugin-mdx",
      options: {
        defaultLayouts: {
          default: require.resolve("./src/components/common/Layout.tsx")
        },
        gatsbyRemarkPlugins: [
          {
            resolve: `gatsby-remark-images`,
            options: {},
          },
        ],
      }
    },
    {
      resolve: "gatsby-source-filesystem",
      options: {
        name: "images",
        path: `${__dirname}/src/images/`,
      },
      __key: "images",
    },

然后在 test.mdx 中我尝试使用静态图像，如下所示：

<StaticImage
    src={'https://images.unsplash.com/photo-1597305877032-0668b3c6413a?w=1300'}
    alt={''}
    width={3840}
    height={1000}
    layout={'constrained'}
/>