Issue with createClient() in getStaticPaths

Developing with Prismic
1

Can anyone tell me what I might be doing wrong. I'm trying to get a [uid].tsx page working with Prismic. I'm using the following code on the page:

/**
 * Get a collection of dynamic URIs based on what's in the CMS
 */
export async function getStaticPaths() {
    const client = createClient();

    const documents = await client.getAllByType('page');

    return {
        paths: documents.map(page => {
            return {
                params: {
                    uid: page.uid
                }
            }
        }),
        fallback: false
    }
}

However, I run into an error when trying to hit a page on that route:

error - prismicio.js (31:24) @ createClient
TypeError: Cannot read properties of undefined (reading 'context')
  29 |     enableAutoPreviews({
  30 |         client,
> 31 |         context: config.context,
     |                        ^
  32 |         req: config.req,
  33 |     })
  34 |

This is my prismicio.js file:

import * as prismic from '@prismicio/client'
import { enableAutoPreviews } from '@prismicio/next'
import sm from './sm.json'

export const endpoint = sm.apiEndpoint
export const repositoryName = prismic.getRepositoryName(endpoint)

// Update the Link Resolver to match your project's route structure
export function linkResolver(doc) {
    switch (doc.type) {
        case 'homepage':
        case "home":
            return '/'
        case 'page':
            return `/${doc.uid}`
        case "branch":
            return `/locations/${doc.uid}`
        default:
            return null
    }
}

// This factory function allows smooth preview setup
export function createClient(config) {
    const client = prismic.createClient(endpoint, {
        ...config,
    })

    enableAutoPreviews({
        client,
        context: config.context,
        req: config.req,
    })

    return client
}
3

Hello @dhayes

Thanks for reaching out to us.

Can you update your prismicio.js file to this?

import * as prismic from '@prismicio/client'
import { enableAutoPreviews } from '@prismicio/next'
import sm from './sm.json'

export const endpoint = sm.apiEndpoint
export const repositoryName = prismic.getRepositoryName(endpoint)

// Update the Link Resolver to match your project's route structure
export function linkResolver(doc) {
  switch (doc.type) {
    case 'homepage':
      return '/'
    case 'page':
      return `/${doc.uid}`
    default:
      return null
  }
}

// This factory function allows smooth preview setup
export function createClient(config = {}) {
  const client = prismic.createClient(endpoint, {
    ...config,
  })

  enableAutoPreviews({
    client,
    previewData: config.previewData,
    req: config.req,
  })

  return client
}

The following is changed:

  • The context param for enableAutoPreviews is changed to previewData
  • The previewData argument is changed to config.previewData (it is config.context now )
  • The config argument now has a default value ( = {} )

Let me know if it still doesn't solve your issue.

Thanks,
Priyanka