Плагин изображений Gatsby не работает на моем веб-сайте

Question

У меня есть проект gatsby, и я использую плагин gatsby-image для отображения изображений. Вот мой файл gatsby-config.js:

module.exports={
 plugins: [
    `gatsby-plugin-react-helmet`,
    `gatsby-plugin-sass`,
    {
      resolve: 'gatsby-source-filesystem',
      options: {
        name: 'src',
        path: `${__dirname}/src`
      }
    },
    'gatsby-transformer-sharp',
    'gatsby-plugin-sharp',
    {
      resolve: `gatsby-source-filesystem`,
      options: {
        name: `images`,
        path: path.join(__dirname, `src`, `images`),
      },
    },
    {
      resolve: 'gatsby-transformer-remark',
      plugins:[
        'gatsby-remark-relative-images',
        {
          resolve: 'gatsby-remark-images',
          options: {
            maxWidth: 750,
            LinkImagesToOriginal: false
          }
        },
      ]
    },
 ]
}

Я также успешно установил пакеты npm gatsby-image, gatsby-transformer-sharp, gatsby-plugin-sharp. Я также перезагрузил сервер разработки.

Я также поместил изображение s.png в путь src / images из корневой папки.

Это мое изображение GraphiQl: