CODEWITHSUNDEEP
reactjstypescriptnext.jsnext.js13app-router
Githendra McShane
Githendra McShane

Reputation: 96

Error when building Next.js 13.4 app: Type 'ResolvingMetadata | undefined' does not satisfy the constraint 'ResolvingMetadata'

I'm trying to dynamically generate metadata for my Next.js 13.4 app using the following code:

export async function generateMetadata(
    { params, searchParams }: Props,
) {
    try {
        // read route params
        const id = params.itemId;

        // fetch data
        const product = await fetch(`${baseUrl}/catelog/item/find/${id}`, {cache: 'no-store'}).then((res) => res.json());

        return {
            title: `Example | ${product.product_name}`,
            description: product.product_description ?? `best selling items at Example store`,
            openGraph: {
                images: [product.product_image],
                title: `Example | ${product.product_name}`,
                description: product.product_description ?? `best selling items at Example store`,
                type: "website"
            },
        };
    } catch (e) {
        return {
            title: `Example | Not found`,
            description: `Product not found`,
        }
    }
}

This code works fine in development, but I'm encountering an error when trying to build the app. The error message is:

Type error: Type 'ResolvingMetadata | undefined' does not satisfy the constraint 'ResolvingMetadata'.
  Type 'undefined' is not assignable to type 'Promise<ResolvedMetadata>'.

I'm not sure how to resolve this error. Can someone please help me understand the root cause of this issue and provide guidance on how to fix it? Thank you!

Upvotes: 0

Views: 868

Answers (1)

Arindam Mitra
Arindam Mitra

Reputation: 61

Build error goes away when you replace it with below snippet.

export async function generateMetadata(): Promise<Metadata>

Upvotes: 0

Related Questions