Запрос фрагмента Gatsby JS в компонент с DatoCMS

Я пытаюсь создать фрагмент и передать его компонентам. Данные поступают из datocms, и обычные запросы, такие как следующие, работают отлично

{
  datoCmsHomeIntro {
    introTitle: introTitleNode {
      markdown: childMarkdownRemark {
        html
      }
    }
    introImage {
      url
    }
  }
}

Я прочитал документы Гэтсби по фрагментам и некоторым другим примерам, но просто не могу заставить его работать.

Прямо сейчас я получил следующее:

в макетах / index.js

export const introFragmentQuery = graphql`
fragment intro on DatoCmsHomeIntro {
  introTitle: introTitleNode {
    markdown: childMarkdownRemark {
      html
    }
  }
  introImage {
    url
  }
}
`

и в моем компоненте:

export const pageQuery = graphql`
  query IntroQuery {
    allDatoCmsHomeIntro {
      edges {
        node {
          ...intro
        }
      }
    }
}
`

Мне явно чего-то не хватает, поэтому любые указатели будут очень признательны.