this metadata trouble | Next.js | Page 1

lean yacht Apr 25, 2023, 6:22 PM

#

barren prismBOT Apr 25, 2023, 6:22 PM

#

Hi @lean yacht. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:

lean yacht Apr 25, 2023, 6:22 PM

#

whats the problem

barren prismBOT Apr 25, 2023, 6:22 PM

#

Sorry @lean yacht, I seem to be having a bit of trouble. Don't worry though, I've pinged my supprt and they will try to fix me up! :technologist:

Perhaps try again in 15mins?

midnight mirage Apr 25, 2023, 6:23 PM

#

lean yacht whats the problem

https://github.com/vercel/next.js/issues/46372

GitHub

Metadata API doesn't work if component is marked with "use client" ...

Verify canary release I verified that the issue exists in the latest Next.js canary release Provide environment information Metadata API doesn't work if component is marked with "use clien...

#

i dont know why vercel does break every app by doing this

#

a lot of people use "use client"

lean yacht Apr 25, 2023, 6:23 PM

#

hmm why would you want to use meta data

#

on a client component?

midnight mirage Apr 25, 2023, 6:23 PM

#

cause my dev used the head.js ..

#

all the time

#

and now, my site just got empty ...

lean yacht Apr 25, 2023, 6:24 PM

#

sure but im saying

#

why do u need meta data on a client component?

#

why cant it just be in a page.tsx or layout.tsx

midnight mirage Apr 25, 2023, 6:24 PM

#

all my pages are clioent components

#

when i get rif of it i get errors

lean yacht Apr 25, 2023, 6:24 PM

#

oh wow

#

This is bad practice tbh

#

your basically not using nextjs features at all

midnight mirage Apr 25, 2023, 6:25 PM

#

?

#

im pretty sure it does haha

#

https://flashsites.de

lean yacht Apr 25, 2023, 6:25 PM

#

if u have everything set as a client component you have 0 server components

midnight mirage Apr 25, 2023, 6:25 PM

#

yeah, whats wrong with it :D?

lean yacht Apr 25, 2023, 6:26 PM

#

it defeats the purpose for peformance and using the app directory lmao

#

either way

midnight mirage Apr 25, 2023, 6:26 PM

#

my site loads ultra quick.. that isnt the issue

lean yacht Apr 25, 2023, 6:26 PM

#

thats not what im saying lol

midnight mirage Apr 25, 2023, 6:26 PM

#

just i have 0 site titles, 0 metadata anymore

lean yacht Apr 25, 2023, 6:26 PM

#

but either way

#

if you want to use metadata

#

I suggest creating a file next to ur page.tsx

#

like clientpage.tsx

#

or something

#

basically make it a client component

#

and have the page.tsx as a server component

#

and use the metadata in that

midnight mirage Apr 25, 2023, 6:28 PM

#

how to include the client component

lean yacht Apr 25, 2023, 6:28 PM

#

just like a normal component

#

import clientpage from "./clientpage"

#

your basically taking everything in ur page.tsx and putting it into a client component

#

and making ur page.tsx a server component again

#

and have the page.tsx define the metadata

midnight mirage Apr 25, 2023, 6:40 PM

#

jep one second will try

#

omg finally i think it has worked

#

for non nextjs experts a nightmare experience though

lean yacht Apr 25, 2023, 6:43 PM

#

lmao

#

fair

#

we on the cutting edge of development so

midnight mirage Apr 25, 2023, 6:46 PM

#

yeah but they just f*** all the nextjs apps you know

#

im sure there is examples its not that easy to switch in a blink

lean yacht Apr 25, 2023, 7:06 PM

#

i dont think saying

#

they just f*** all nextjs apps is accurate

#

To decompress that statement you need to understand multiple things

#

First and foremost nextjs13 app directory is literally beta. Meaning anything can change at any moment

#

its why its not stable

#

So as for the head.js it was clearly marked as deprecated and showed that going forward you shouldnt use that.

#

And because its new and beta software, also means that anyone who does choose to use it, has to deal with the consequences of unforseen bugs, aswell as breaking changes. Its the entire point of a beta software so they can test stuff out. If you wanted to continue using head.js, rollback to older versions.

#

@midnight mirage

midnight mirage Apr 25, 2023, 7:30 PM

#

i get it, still bummer ya know?

#this metadata trouble