Query Extraction and Execution

After the createPages API executes, the next step in the Gatsby build lifecycle is for Gatsby to extract and execute the queries that declare data requirements for each page and component present in the Gatsby files. In Gatsby, GraphQL queries are defined as tagged graphql expressions. These expressions can be:

• Exported in page files
• Utilized in the context of the StaticQuery component
• Employed in a useStaticQuery hook in React code

These are all uses that we have seen previously. In addition, plugins can also supply arbitrary fragments that can be used in queries.

In this section, we’ll examine the query extraction and execution process and how Gatsby furnishes the data that makes up each component and template. Note, however, that this discussion does not cover queries designated in implementations of Gatsby’s Node APIs, which are usually intended for programmatic page creation and operate differently.

NOTE

The majority of the source code in the Gatsby project that performs query extraction and execution is found in the src/query directory within the Gatsby repository.