Craft CMS GraphQL matrix shared fragment example

contentModule.gql

import gql from 'graphql-tag'
import { print } from 'graphql/language/printer'
import richTextFragment from './contentModules/richText.gql'
import logoBlockFragment from './contentModules/logoBlock.gql'
import embedBlockFragment from './contentModules/embedBlock.gql'
import videoBlockFragment from './contentModules/videoBlock.gql'
import imageCollageFragment from './contentModules/imageCollage.gql'
import imageGridFragment from './contentModules/imageGrid.gql'
import slideshowBlockFragment from './contentModules/slideshowBlock.gql'
import singleImageFragment from './contentModules/singleImage.gql'

const contentModulesFragment = gql`
fragment contentModules on contentModules_MatrixField {
  ...on contentModules_richText_BlockType {
    ...richText
  }
  ...on contentModules_logoBlock_BlockType {
    ...logoBlock
  }
  ...on contentModules_embedBlock_BlockType {
    ...embedBlock
  }
  ...on contentModules_videoBlock_BlockType {
    ...videoBlock
  }
  ...on contentModules_imageCollage_BlockType {
    ...imageCollage
  }
  ...on contentModules_imageGrid_BlockType {
    ...imageGrid
  }
  ...on contentModules_slideshowBlock_BlockType {
    ...slideshowBlock      
  }
  ...on contentModules_singleImage_BlockType {
    ...singleImage      
  }
}
${richTextFragment}
${logoBlockFragment}
${embedBlockFragment}
${videoBlockFragment}
${imageCollageFragment}
${imageGridFragment}
${slideshowBlockFragment}
${singleImageFragment}
`
export default print(contentModulesFragment)

program.gql

import gql from 'graphql-tag'
import { print } from 'graphql/language/printer'
import contentModulesFragment from './fragments/contentModules.gql'

const programQuery = gql` 
query program($slug: [String], $site: [String]) {
  entry(section: "programs", slug: $slug, site: $site) {
    id
    title
    ... on programs_liveProgram_Entry {
      contentModules {
        ...contentModules
      }
    }
     ... on programs_program_Entry {
      contentModules {
        ...contentModules
      }
    }
  }
}
${contentModulesFragment}
`
export default print(programQuery)

richText.gql

import gql from 'graphql-tag'
import { print } from 'graphql/language/printer'

const richTextFragment = gql`
fragment richText on contentModules_richText_BlockType {
  id
  typeHandle
  sectionHeading
  body
}

`
export default print(richTextFragment)

program.gql is the main query for a section, including multiple entryTypes. Each entry type loads the contentModulesFragment from contentModules.gql. Each blockType is loaded as a fragment from the contentModules query - richText being the most simple example. You can then reuse the contentModules fragment across all of your sections and entryTypes.