Issue Station
Sign In
Tools hereToolbox

nextjs - 💡(How to fix) Fix Using `next/font` results in `Font loader calls must be assigned to a const` in Pages Router [16 comments, 6 participants]

Official PRs (…)
ON THIS PAGE

Recommended Tools

×6

Utilities matched from this issue’s tags and category — try them while you read without losing context.

GitHub issue graph ai analysis

Paste a GitHub issue URL. We fetch that issue, discover linked issues from bodies/comments/timeline, collect linked pull requests, and produce a structured English report.

The report is written in English Markdown for sharing and archival.

Helpful · Quick feedback

Loading…
GitHub stats
vercel/next.js#86792•Fetched 2026-04-08 02:09:08
View on GitHub
Comments
16
Participants
6
Timeline
35
Reactions
8
Author
jonahallibonejonahallibone
Participants
dlehmhusdlehmhusGrohdenGrohdenicyJosephicyJosephjonahallibonejonahallibonestefanprobststefanprobstYukigamineYukigamine
Timeline (top)
commented ×16subscribed ×11mentioned ×5issue_type_added ×1

Error Message

  1. Error I don't expect an error The error is Build Error Ecmascript file had an error Ecmascript file had an error The resolution is to not use next/font at all. Once this starts to happen, it is also incredibly difficult to undo, because the cause is unknown. There is also very little in way of errors. The console only reports a 500 on the route, and the browser console logs the same error as in the overlay. I assume, based on the error, that this is a problem with SWC. I am only able to reproduce this by paring down my project. Fresh installations of Next.js work completely fine. I am assuming this is related to some other dependency.

Root Cause

The resolution is to not use next/font at all. Once this starts to happen, it is also incredibly difficult to undo, because the cause is unknown. There is also very little in way of errors. The console only reports a 500 on the route, and the browser console logs the same error as in the overlay. I assume, based on the error, that this is a problem with SWC. I am only able to reproduce this by paring down my project. Fresh installations of Next.js work completely fine. I am assuming this is related to some other dependency.

Code Example

Operating System:
  Platform: darwin
  Arch: arm64
  Version: Darwin Kernel Version 24.6.0: Mon Jul 14 11:30:29 PDT 2025; root:xnu-11417.140.69~1/RELEASE_ARM64_T6000
  Available memory (MB): 32768
  Available CPU cores: 10
Binaries:
  Node: 24.11.1
  npm: 11.6.2
  Yarn: 1.22.19
  pnpm: 9.6.0
Relevant Packages:
  next: 16.0.7 // Latest available version is detected (16.0.7).
  eslint-config-next: N/A
  react: 19.2.1
  react-dom: 19.2.1
  typescript: 5.9.3
Next.js Config:
  output: N/A

---

Build Error


Ecmascript file had an error
./src/pages/_app.tsx (4:1)

Ecmascript file had an error
  2 | import { Inter } from "next/font/google";
  3 |
> 4 | const inter = Inter({ subsets: ["latin"] });
    | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
  5 |
  6 | export default function App({ Component, pageProps }: AppProps) {
  7 |   return (

Font loader calls must be assigned to a const
RAW_BUFFERClick to expand / collapse

Link to the code that reproduces this issue

https://github.com/jonahallibone/next-font-bug

To Reproduce

  1. npm install
  2. npm run dev
  3. Error

Current vs. Expected behavior

I don't expect an error

Provide environment information

Operating System:
  Platform: darwin
  Arch: arm64
  Version: Darwin Kernel Version 24.6.0: Mon Jul 14 11:30:29 PDT 2025; root:xnu-11417.140.69~1/RELEASE_ARM64_T6000
  Available memory (MB): 32768
  Available CPU cores: 10
Binaries:
  Node: 24.11.1
  npm: 11.6.2
  Yarn: 1.22.19
  pnpm: 9.6.0
Relevant Packages:
  next: 16.0.7 // Latest available version is detected (16.0.7).
  eslint-config-next: N/A
  react: 19.2.1
  react-dom: 19.2.1
  typescript: 5.9.3
Next.js Config:
  output: N/A

Which area(s) are affected? (Select all that apply)

Turbopack

Which stage(s) are affected? (Select all that apply)

next dev (local)

Additional context

This was happening in our monorepo on one project, so I extracted the project and progressively brought it down to this reproduction

The error is

Build Error


Ecmascript file had an error
./src/pages/_app.tsx (4:1)

Ecmascript file had an error
  2 | import { Inter } from "next/font/google";
  3 |
> 4 | const inter = Inter({ subsets: ["latin"] });
    | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
  5 |
  6 | export default function App({ Component, pageProps }: AppProps) {
  7 |   return (

Font loader calls must be assigned to a const

Things I have tried:

  1. Moving font definitions into a module and importing them
  2. Removing almost all of our other dependencies

The resolution is to not use next/font at all. Once this starts to happen, it is also incredibly difficult to undo, because the cause is unknown. There is also very little in way of errors. The console only reports a 500 on the route, and the browser console logs the same error as in the overlay. I assume, based on the error, that this is a problem with SWC. I am only able to reproduce this by paring down my project. Fresh installations of Next.js work completely fine. I am assuming this is related to some other dependency.

extent analysis

TL;DR

The most likely fix is to avoid using next/font in the project, as it seems to be the cause of the error.

Guidance

  • The error message suggests that font loader calls must be assigned to a const, but the issue persists even after trying different approaches, indicating a potential problem with the next/font module itself.
  • The fact that fresh installations of Next.js work fine, but the issue occurs in a specific project, suggests that there might be a dependency conflict or an issue with the project's configuration.
  • Try removing next/font and use an alternative font loading method to see if the issue resolves.
  • If the issue is related to SWC, as suspected, try updating or configuring SWC settings to see if it resolves the problem.

Example

No code example is provided as the issue seems to be related to the next/font module and its interaction with the project's dependencies.

Notes

The exact cause of the issue is still unknown, and more investigation might be needed to determine the root cause. However, avoiding the use of next/font seems to be a viable workaround.

Recommendation

Apply workaround: Avoid using next/font in the project, as it seems to be the cause of the error, and explore alternative font loading methods.

Vote matrix · Quick signals

Works
Did the solution work? Tap to confirm.
Easy Fix
Was it a quick fix?
Time Saver
Did it save you time?
Blocking
Was it severely blocking?
Common Issue
Are others likely hitting this too?
Flaky / Intermittent
Is it intermittent?
Verified / Reproducible
Can you reproduce it reliably?
Loading…
#installation#inference speed#output truncation#response parsing#generation error

Still need to ship something?

×6

Another batch ranked right after the header list — different links, same matching logic.

Back to top recommendations

TRENDING