next/font loader not called at module scope

perf/font-module-scopeerrornextjs-16correctness

Why it matters

next/font is resolved at build time: the loader must be called at the top level of the module and assigned to a const, or the build fails.

Fix

const font = Inter({ subsets: ["latin"] }) at module scope, then use font.className in components.

Credit

  • From the Next.js team

    The font loader is resolved at build time, so it must be called at module scope and assigned to a const.

References

See it

Load fonts with next/font