Next.js blog site deployment to Vercel failing with "Cannot read properties of undefined" error

7 replies
Last updated: Nov 13, 2022
Hi I followed this tutorial to make a nextjs blog site and it works perfectly locally, i can see my blog post, but when i deploy it to vercel and deploy sanity studio and add the cors allowance for everything, i am only getting vercel build failures.
My code is exactly the same as in that blog post, is it because i am using a custom domain?

info  - Generating static pages (0/138)
Error occurred prerendering page "/post/[slug]". Read more: <>
TypeError: Cannot read properties of undefined (reading 'title')
    at Post (/vercel/path0/.next/server/pages/post/[slug].js:70:5)
    at d (/vercel/path0/node_modules/react-dom/cjs/react-dom-server.node.production.min.js:33:498)
    at bb (/vercel/path0/node_modules/react-dom/cjs/react-dom-server.node.production.min.js:36:16)
    at a.b.render (/vercel/path0/node_modules/react-dom/cjs/react-dom-server.node.production.min.js:42:43)
    at (/vercel/path0/node_modules/react-dom/cjs/react-dom-server.node.production.min.js:41:83)
    at Object.exports.renderToString (/vercel/path0/node_modules/react-dom/cjs/react-dom-server.node.production.min.js:52:138)
    at Object.renderPage (/vercel/path0/node_modules/next/dist/server/render.js:736:46)
    at Function.getInitialProps (/vercel/path0/.next/server/chunks/859.js:618:16)
    at Object.loadGetInitialProps (/vercel/path0/node_modules/next/dist/shared/lib/utils.js:69:29)
Nov 12, 2022, 12:08 AM
my slug page
// [slug].js
import groq from 'groq'
import imageUrlBuilder from '@sanity/image-url'
import { PortableText } from '@portabletext/react'
import client from '../../utils/client'

import { Meta } from '../../layout/Meta';
import { AppConfig } from '../../utils/AppConfig';
import { NavBar } from '../../templates/NavBar';

function urlFor (source) {
  return imageUrlBuilder(client).image(source)

const Post = ({post}) =&gt; {
  const {
    title = 'Missing title',
    name = 'Missing name',
    body = []
  } = post
  return (
    &lt;article className='text-xl center'&gt;
      &lt;Meta title={AppConfig.title} description={AppConfig.description} /&gt;
      &lt;NavBar /&gt;
      &lt;h1 className='text-6xl'&gt;{title}&lt;/h1&gt;
      {categories &amp;&amp; (
          Posted in
          { =&gt; &lt;li key={category}&gt;{category}&lt;/li&gt;)}
      { (
            alt={`${name}'s picture`}
      className={'white-space: pre-line grid gap-14 md:gap-22 lg:gap-24 '}

const query = groq`*[_type == "post" &amp;&amp; slug.current == $slug][0]{
  "name": author-&gt;name,
  "categories": categories[]-&gt;title,
  "authorImage": author-&gt;image,
  "mainImage": mainImage,
export async function getStaticPaths() {
  const paths = await client.fetch(
    groq`*[_type == "post" &amp;&amp; defined(slug.current)][].slug.current`

  return {
    paths: =&gt; ({params: {slug}})),
    fallback: true,

export async function getStaticProps(context) {
  // It's important to default the slug so that it doesn't return "undefined"
  const { slug = "" } = context.params
  const post = await client.fetch(query, { slug })
  return {
    props: {
export default Post
Nov 12, 2022, 12:09 AM
What’s the build error you are getting at vercel?
Nov 12, 2022, 12:40 AM
the build error is in the first log:
Error occurred prerendering page "/post/[slug]". Read more: <>
TypeError: Cannot read properties of undefined (reading 'title')

Nov 12, 2022, 3:42 AM
(curious about the answer, subscribing to thread) 👀
Nov 12, 2022, 9:37 AM
user C
any ideas? Not sure why title is not being found on vercel I feel like with all the CORS origins I added it probably isn't an issue with vercel not being able to connect to sanity?
Nov 12, 2022, 11:31 PM
user A
if CORS is good to go typically the next culprit are the variables at Vercel. Here’s a few more things to check:
• If you have localHost specified in your project
• If your build command isn’t correct. at Vercel
• In the event you are using variables, that they match
• That you are using the same version of NPM both locally and on Vercel
Nov 12, 2022, 11:47 PM
Wow I redeployed 3 times out of frustration and all of a sudden its working now.. my nextjs projects might be cursed lmao... Thankyou!
Nov 13, 2022, 4:04 AM

Sanity– build remarkable experiences at scale

The Sanity Composable Content Cloud is the headless CMS that treats content as data to power your digital business. Free to get started, and pay-as-you-go on all plans.

Was this answer helpful?