DEV Community

Habeebullahi01
Habeebullahi01

Posted on

Next build error collecting page data; + Chakra UI

Hi there,
This post is about an error I faced recently in a Next.js project.
I got the following error when I ran the next build command.

Collecting page data ...TypeError: d is not a function

Followed by a stack trace which pointed to files in the .next directory. After that came the next helpful output.

Build error occurred
Error: Failed to collect page data for /featured/[slug]

On inspection of the files in the [slug] dynamic path there was only one difference between the previous commit that worked and the current commit that was failing; the use of the Chakra UI's Link component from the chakra-ui/next-link module. Previously the same component was imported from next/link, but in an effort to refactor the code base I changed to the one exported from Chakra UI and ended up breaking that part. Changing the import back to the next/link module fixed the problem.
I effected similar change in another dynamic path and it was fixed as well.

The problem seems to be from the Next.js compatible Link component exported by Chakra UI. I currently don't have any interest in pursuing the cause of this problem in Chakra UI, especially considering that both the Next.js and Chakra UI versions that the project uses are not the latest ones. This error may not be existent in the latest versions of these tools.

My Versions

Next.js: 14.2.3
chakra-ui/next-js: 2.2.0

I hope this has been helpful. Thank you for your time.

Top comments (0)