Как загрузить изображения из поля url на другом узле в Gatsbyjs, чтобы я мог использовать gatsby-image? - PullRequest
1 голос
/ 23 апреля 2019

Я работаю над оптимизацией изображений для сайта с использованием Gatsby и Kentico Cloud.Я хочу использовать плагин gatsby-image, но gatsby-image не может запрашивать поля URL.Поэтому мне нужно загрузить эти образы из CMS на другом узле, чтобы их можно было запросить по gatsby-image.

Я пытался реализовать это с помощью другого плагина, gatsby-plugin-remote-images, но пока он не работает.Я не уверен, что неправильно понимаю документацию.

Вот мой последний код из gatsby-config

{
  resolve: `gatsby-plugin-remote-images`,
  options: {
    nodeType: 'kenticoCloudItemAbout',
    imagePath: 'data.kenticoCloudItemAbout.elements.main_image.value[0].url'
  }
}

Насколько я понимаю, теперь я должен иметь возможность запросить localImage (послеперезапустите сервер) из GraphiQL и посмотрите путь к загруженному файлу, но это не похоже на работу.

Спасибо!

1 Ответ

1 голос
/ 29 апреля 2019

Как новичок в GatsbyJS, я тоже с этим боролся, прежде чем заставить его работать.Во-первых, я не думаю, что ваша конфигурация imagePath должна включать data., которая является переменной, используемой в компонентах для возврата результатов graphQL.Начните с kenticoCloudItemAbout.Если это не работает, я обнаружил, что вложенный imagePath был проблематичным.(Либо я еще не понимаю правильное использование imagePath, либо плагину не нравится вложенная структура.) Например, моя структура запросов / данных GraphQL выглядит следующим образом:

  {
  allMyNodes{
    edges {
      node {
            levelOneField
            subItem {
              levelTwoField
              subSubItem {
                imageURL
              }
            }
          }
        }
      }
    }

Когда яused { nodeType="myNodes", imagePath="myNodes.edges.node.subitem.subsubitem.imageURL"} Мне не повезло заставить плагин работать.Однако, когда он указывал прямо на узел с моим imageURL, как { nodeType="subSubItem", imagePath="imageURL"}, это работало.Также следите за ошибками в терминале при сборке gatsby develop.Ошибки, такие как imageURL не указывает на файл (неработающая ссылка), вызывали проблемы.Наконец, убедитесь, что вы не включаете фрагменты GraphQL (например, ...GatsbyImageSharpFluid) в окно GraphiQL.В GraphiQL старайтесь ссылаться только на свойства объекта localImage, чтобы проверить, работает ли плагин для вас.Например:

{
    allSubSubItem {
      imageURL
      localImage {
         id
      }
    }
 }
...