Next.js Discord

Discord Forum

google fonts is not working on localhost but works in deploy domain

Answered
Somali posted this in #help-forum
Open in Discord
Avatar
SomaliOP
has anyone had this problem?
I think this happened when I started using my non-SSL API backend.
I don't have 404 errors in the font, it's just that my fonts use fallback like they don't load.
I already installed ssl, but the problem remains
Image
Image
Answered by Dayo
well, i've encountered this issue with Next 13 but as described in this thread below. i'm not 100% sure what's happening in your case. but if it worked before, try some of the recommendations in the thread

https://nextjs-forum.com/post/1128431714323144784
View full answer

20 Replies

Avatar
SomaliOP
anyone?
Avatar
any errors in your terminal?
Avatar
SomaliOP
no, only that .
guess this from chrome extention
Image
Avatar
i mean in your code editor
Avatar
SomaliOP
yeah, i have this on start dev server.
i try to check this err
Image
Avatar
what does your layout.jsx file look like?
Avatar
SomaliOP
Image
Avatar
why's clsx underlined?
Avatar
SomaliOP
this spell checker
Avatar
i think this error is due to the casing of your file path. see if this helps fix it

https://github.com/vercel/next.js/issues/10739#issuecomment-612324746
but as per your original issue, i don't see your font loaded in the network tab. how are you importing it?
Avatar
SomaliOP
i import in app js,
on my vercel deploy font load correct
Image
Avatar
try removing the clsx from the className
Avatar
SomaliOP
same result
Avatar
wait, how come you're using the _app file with the next/font? what version of Next are you using?

and where is your css variable declared?
Avatar
SomaliOP
next js 13

I will also clarify that at the start of the development of this project, everything worked correctly. At some point, the fonts fell off, I don’t know at what
Image
as you can see, next js use fallback font
Avatar
well, i've encountered this issue with Next 13 but as described in this thread below. i'm not 100% sure what's happening in your case. but if it worked before, try some of the recommendations in the thread

https://nextjs-forum.com/post/1128431714323144784
Answer
Avatar
SomaliOP
yeah, i delet .next folder and its okay.
thank you!!
Avatar
awesome!