#next/font/google not working after upgrading to latest next.js (16.0.3)

1 messages · Page 1 of 1 (latest)

topaz imp
#

I upgraded my project from Next.js 15 to Next.js 16 today, now the font loader causes compilation error:

## Error Type
Build Error

## Error Message
Ecmascript file had an error

## Build Output
./frontend/src/styles/fonts.ts:69:1
Ecmascript file had an error
  67 | });
  68 |
> 69 | const inconsolata = Inconsolata({
     | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
> 70 |   weight: ["500"],
     | ^^^^^^^^^^^^^^^^^^
> 71 |   style: ["normal"],
     | ^^^^^^^^^^^^^^^^^^
> 72 |   subsets: ["latin"],
     | ^^^^^^^^^^^^^^^^^^
> 73 |   variable: "--font-inconsolata",
     | ^^^^^^^^^^^^^^^^^^
> 74 |   display: "swap",
     | ^^^^^^^^^^^^^^^^^^
> 75 | });
     | ^^^^
  76 |
  77 | export const fonts = {
  78 |   interFont,

Font loader calls must be assigned to a const

Import traces:
  Browser:
    ./frontend/src/styles/fonts.ts
    ./frontend/src/pages/_app.tsx

  SSR:
    ./frontend/src/styles/fonts.ts
    ./frontend/src/pages/_app.tsx

Next.js version: 16.0.3 (Turbopack)

I have tried to reproduce this on a fresh project with the exact same structure, and could not. I have debugged this every which way I can think and cannot figure this out. It's directly tied to Turbopack, as using --webpack during next dev does resolve the issue. Our app is just incredibly slow with webpack (we've been on turbo for almost 2 years with no issues).

normal pulsarBOT
#

🔎 This post has been indexed in our web forum and will be seen by search engines so other users can find it outside Discord

🕵️ Your user profile is private by default and won't be visible to users outside Discord, if you want to be visible in the web forum you can add the "Public Profile" role in id:customize

✅ You can mark a message as the answer for your post with Right click -> Apps -> Mark Solution
(if you don't see the option, try refreshing Discord with Ctrl + R)