Google Font not loading in Production
Unanswered
Ceddix posted this in #help-forum
CeddixOP
I wanted to use the Fira Font (from Google) on my website.
I added it using
I works in my developement environement, but it doesn't seem to work in production, after building it (using it as standalone). The font doesn't get loaded, and I get a 404 error:
I hope you guys can help me 🙂
I added it using
import { Fira_Sans } from 'next/font/google'
const fira = Fira_Sans({ subsets: ['latin'], weight: "400" })
...
<body className={fira.className}>I works in my developement environement, but it doesn't seem to work in production, after building it (using it as standalone). The font doesn't get loaded, and I get a 404 error:
Request URL: https://.../_next/static/media/4d1af68a2715a16a-s.p.woff2
Request Method: GET
Status Code: 404 Not FoundI hope you guys can help me 🙂
1 Reply
CeddixOP
The file which (I think) contains the font seems to be generated if I look at the file system under
If I try to navigate to the css file for example (
It's just the fonts that aren't working.
.next/standalone/static/media/4d1af68a2715a16a-s.p.woff2 but if I try to navigate to https://mydomain.tdl/_next/static/media/4d1af68a2715a16a-s.p.woff2 I get the 404 error page.If I try to navigate to the css file for example (
https://mydomain.tld/_next/static/css/fbb04b8a4ec7a9fa.css), the right file is loaded (and it is also used on the website).It's just the fonts that aren't working.