Локальные изображения: редактирование схемы gatsby для преобразования локального пути к файлу

Question

Я использую gatsby, и мне нужно отображать несколько изображений для данного объекта. Пути к изображениям хранятся в таблице MySQL, и я отлично их получаю.

Мой запрос выглядит так:

{
  mysqlSet(entity_id: {eq: "10270"}) {
    name
    images {
      url
    }
  }
}

Это дает мне такой результат:

{
  "data": {
    "mysqlSet": {
      "name": "My Entity Name",
      "images": [
        {
          "url": "./images/10270-0.png"
        },
        {
          "url": "./images/10270-1.png"
        },
        {
          "url": "./images/10270-2.png"
        }
      ]
    }
  }
}

Итак, возникает вопрос: как мне изменить мою схему, чтобы отразить, что эти поля на самом деле являются изображениями? Я имею в виду, что я иду по этому пути, но не могу понять, как это сделать.

По сути, мне нужно получить изображения в виде файлов, чтобы использовать их со встроенным компонентом Img Gatsby.

Answer 1

Вы можете запросить, используя allFile и отфильтруйте желаемое расширение, например:

 {
      allFile(filter: {ext: {eq: ".png"}}) {
        edges {
          node {
            absolutePath
          }
        }
      }
    }