next.jssanitygroq

Generating static pages (0/8)TypeError: Cannot destructure property 'title' of 'post' as it is undefined


I'm developing a blog using nextJS & sanity. And I connected sanity with nextJS and it's perfectly working in development mode. But when I try to deploy in Vercel or build through the VSCode, it shows the below error.

info  - Generating static pages (0/8)TypeError: Cannot destructure property 'title' of 'post' as it is undefined.

Here is my component overview

export default function SinglePost({ post }) {
  const {
    title,
    imageUrl,
    publishedAt,
    description,
    topics,
    rescources,
    sourcecode,
    body = [],
  } = post;
return(
<div>
    <h1>{title}</h1>
    //remaining code....
</div>)
}
const query = groq`*[_type == "post" && slug.current == $slug][0]{
  "title": title,
  "imageUrl": mainImage.asset->url,
  description,
  "topics": topics[],
  "rescources": rescources[],
  "sourcecode": sourcecode,
  "publishedAt": publishedAt,
  body,
  
}`;

export async function getStaticPaths() {
  const paths = await client.fetch(
    `*[_type == "post" && defined(slug.current)][].slug.current`
  );

  return {
    paths: paths.map((slug) => ({ params: { slug } })),
    fallback: true,
  };
}

export async function getStaticProps(context) {
 
  const { slug = "" } = context.params;
  const post = await client.fetch(query, { slug });
  return {
    props: {
      post,
    },
  };
}

Solution

  • I was able to solve this problem.

    Solution: Without destructuring 'title', I got a value through the direct access

    <h1>{post.title}</h1>