Turbopack crashes in `pages/_app.tsx` when `next/font` is imported

[jantimon]

Link to the code that reproduces this issue

https://github.com/jantimon/repro-turbopack-font-bug

To Reproduce

minimal source:

styles/globals.css

html,
body {
  margin: 0;
  padding: 0;
  font-family: system-ui, sans-serif;
}

pages/_app.tsx

import "../styles/globals.css";
import type { AppProps } from "next/app";
import { Geist_Mono } from "next/font/google";

export const geistMono = Geist_Mono({
  variable: "--font-geist-mono",
  subsets: ["latin"],
});


export default function App({ Component, pageProps }: AppProps) {
  return (
    <main className={geistMono.className}>
      <Component {...pageProps} />
    </main>
  );
}

steps:

1. clone the repo
2. npm install
3. npm run build
4. error below

also reproduces with next dev --turbopack returns 500 on /

Current vs. Expected behavior

turbopack throws Global CSS cannot be imported from files other than your Custom <App> on pages/_app.tsx even though _app.tsx IS the custom app

only triggers when _app.tsx imports BOTH a global css file AND next/font - remove either and build passes

webpack builds the same file fine

error from next build --turbopack:

Error: Turbopack build failed with 1 errors:
./pages/_app.tsx
Global CSS cannot be imported from files other than your Custom <App>.
Due to the Global nature of stylesheets, and to avoid conflicts, Please move all first-party global CSS imports to pages/_app.js. Or convert the import to Component-Level CSS (CSS Modules).
Location: pages/_app.tsx
Import path: ../styles/globals.css

expected: turbopack accepts global css in _app.tsx same as webpack does

Provide environment information

Operating System:
  Platform: darwin
  Arch: arm64
  Version: Darwin Kernel Version 25.3.0
  Available memory (MB): 65536
  Available CPU cores: 10
Binaries:
  Node: 24.13.0
  npm: 11.6.2
  Yarn: 1.22.19
  pnpm: 10.33.1
Relevant Packages:
  next: 16.3.0-canary.2 // Latest available version is detected (16.3.0-canary.2).
  eslint-config-next: N/A
  react: 19.2.4
  react-dom: 19.2.4
  typescript: 5.9.3
Next.js Config:
  output: N/A

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

CSS, Font (next/font), Pages Router, Turbopack

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

next dev (local), next build (local)

Additional context

trigger matrix from the repro:

variant	turbopack
font + global css in _app.tsx	❌ fails
only global css	✅
only next/font	✅
font + css with relative path instead of @/ alias	❌
font + css with --webpack	✅
font + css with next dev --turbopack	❌ 500

also reproduces on next@16.2.4 - no canary bisection done

[Joshbwr]

I'm running into this issue on version 15.5.18

[brijeshb42]

Here's another reproduction for the issue - https://github.com/brijeshb42/turbopack-global-css-reexport-repro (Next.js v16 canary).

The main issue in my case is that if I re-export something while also importing global css, it throws the same error. But if I remove the re-export or the css import, it builds fine.