Error installing "stablo" template, resolved with code change.
I can see you're getting an error where post.author.image is undefined or null when the PostList component tries to render. This is a common issue with the Stablo template that typically happens when the GROQ query fetching your posts isn't properly populating the author's image data.
Here are the most likely solutions:
1. Check your GROQ query
The most common cause is that your GROQ query in the page or component isn't using a reference expansion for the author field. Look for where posts are being fetched (likely in getStaticProps or a data fetching function) and make sure the query expands the author reference and includes the image:
// Instead of just "author"
*[_type == "post"] {
...,
author-> // This expands the reference
}
// Make sure it includes the image field
*[_type == "post"] {
...,
author-> {
name,
image
}
}2. Add a safety check As a quick fix, you can add optional chaining to prevent the error:
{post?.author?.image && (
<Image
src={AuthorimageProps.src}
blurDataURL={AuthorimageProps.blurDataURL}3. Verify your content Check in your Sanity Studio that:
- The post actually has an author assigned
- That author document has an image field populated
- The image field in your author schema is properly configured
4. Check the AuthorimageProps function
Make sure the function that generates AuthorimageProps is correctly handling the post.author.image object. It should be using Sanity's image URL builder properly.
The Stablo template has had some reported issues with initial setup, so if you're still stuck, you might want to check the Stablo GitHub repository for any recent updates or issues that match yours. The template maintainers may have already addressed this in a newer version.
If none of these work, share your GROQ query and I can help you debug it further!
Sanity – Build the way you think, not the way your CMS thinks
Sanity is the developer-first content operating system that gives you complete control. Schema-as-code, GROQ queries, and real-time APIs mean no more workarounds or waiting for deployments. Free to start, scale as you grow.