I have a Gatsby project using Prismic and am in the middle of the plug-in swap. However, I am needing to go through and refactor all of the queries due to the new plug-in and have been having some issues getting data to return on any of the document fields. All of them return null. This was not an issue with the old plug-in. Trying to query data from the body field does the same. Can someone please help? The new plug-in I am referring to is the gatsby-source-prismic.
Hello Maddy, thanks for reaching out about this, I'll be happy to help you.
Have you seen our dedicated guide for migrating to gatsby-source-prismic?
A key step in the migration that is not supper obvious is that you need to manually add your Custom type JSON files to your project, so the GraphQL schema recognizes your fields, slices, and whatnot.
Can you show me an example of the queries you're making, and where exactly are you getting stuck?
I have seen this documentation and I have manually added all the custom types to my project. I am able to retrieve other data but not any slices.
This is a query using the old plug-in that I have tried to refactor using the new plug-in:
export const query = graphql`
{
prismic {
content: allHome_page__generals {
edges {
node {
meta_title
meta_description
hero_header
hero_copy
hero_image
market_challenge_text
services_eyebrow
services_image
services_header
services_copy
about_eyebrow
about_header
about_copy
careers_eyebrow
careers_header
careers_copy
careers_background
careers_image
library_eyebrow
library_header
library_copy
library_challenge_text
featured_project {
... on PRISMIC_Publication {
_meta {
uid
}
title
summary
image
body {
... on PRISMIC_PublicationBodyProject_proof_data {
primary {
stat_1_value
stat_1_context
stat_1_source
stat_2_value
stat_2_context
stat_2_source
stat_3_value
stat_3_context
stat_3_source
}
}
}
}
}
publications {
publication {
... on PRISMIC_Publication {
_meta {
id
uid
}
title
type
image
summary
}
}
}
}
}
}
markets: allMarkets(sortBy: priority_ASC) {
edges {
node {
name
thumbnail
_meta {
uid
}
}
}
}
}
}
`;
When I try to access the feauture project ...on PRISMIC Publication or any other slices in any of the queries I get null.
Here is a quick example trying to access just the feature project as in the query above:
query MyQuery {
allPrismicHomePageGeneral {
edges {
node {
data {
featured_project {
document {
... on PrismicPublication {
id
}
}
}
about_header
careers_eyebrow
hero_header
}
}
}
}
}
Here is the response I get in the GraphiQL playground:
{
"data": {
"allPrismicHomePageGeneral": {
"edges": [
{
"node": {
"data": {
"featured_project": {
"document": null
},
"about_header": "Mutual Success",
"careers_eyebrow": "CAREERS",
"hero_header": "We are POWER"
}
}
}
]
}
},
"extensions": {}
}
Again, this is one example. I get null for the document on every query I have tried to retrieve document data in.
Thank you for sending over this info.
If everything is set up correctly it's a bit difficult to tell if something isn't right in your queries just at first glance. But maybe is something related to the custom types, perhaps the naming of a slice.
If you want you can send me your project code if you have it in Github or in a zip file; and Prismic repo name, that way I'll be able to reproduce the issue first hand. You can send me these via dm.
Let me know if this would be a good option for you.
Thanks
That would be amazing, Paulina! I have a meeting on Tuesday to provide an update to the client and would love to have this sorted out. I'll send the DM right now.
Update: Using dashes in Custom type names or in the API IDs of the fields can cause problems in the GraphQL schema. If your Custom type name has a dash e.g.,
home_page_-_general
You need to wrap the name in single quotes in the gatsby-config.js:
'home_page_-_general': require('./src/schemas/home_page_-_general'),
Also, make sure you're using the latest version of the plugin, you can check the latest version on npm here.
This topic was automatically closed 24 hours after the last reply. New replies are no longer allowed.