Google fonts are not being bundled in Next.js 15 turbopack dev builds

[byytelope]

Link to the code that reproduces this issue

https://github.com/byytelope/tailwind4test

To Reproduce

1. Start using next dev
2. See that the mono font is applied to the text, and font files are available when inspecting source.
3. Remove .next dir
4. Start using next dev --turbo
5. See that the default sans font is being used instead of the custom one, and no font files are bundled when inspecting source.

Current vs. Expected behavior

Web fonts loaded using next/font/google, and set up using the TailwindCSS v4 alpha do not seem to be bundled in when using turbopack for development.

When using webpack with next dev, the font loads and seems to be bundled in properly.

But when using turbopack with next dev --turbo, the font does not load and does not seem to be bundled in properly.

This issue was reported before but was fixed for some by removing the .next directory and rebuilding. I can reproduce this issue reliably on both Safari 18.1 and Edge 130.0.2849.46 on macOS 18.1.

Provide environment information

Operating System:
  Platform: darwin
  Arch: arm64
  Version: Darwin Kernel Version 24.1.0: Thu Oct 10 21:02:26 PDT 2024; root:xnu-11215.41.3~2/RELEASE_ARM64_T8122
  Available memory (MB): 16384
  Available CPU cores: 8
Binaries:
  Node: 22.9.0
  npm: 10.8.3
  Yarn: N/A
  pnpm: N/A
Relevant Packages:
  next: 15.0.1-canary.1 // Latest available version is detected (15.0.1-canary.1).
  eslint-config-next: N/A
  react: 19.0.0-rc-69d4b800-20241021
  react-dom: 19.0.0-rc-69d4b800-20241021
  typescript: 5.3.3
Next.js Config:
  output: N/A

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

Font (next/font), Turbopack

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

next dev (local)

Additional context

Issue appears on builds of next>="15.0.0-canary.153", including the stable release.

[lfades]

Can confirm it is a bug. The problem is that the font declaration in the case of Turbopack doesn't have the src property. E.g

@font-face {
  font-family: 'Inconsolata';
  font-style: normal;
  font-weight: 200 900;
  font-stretch: 100%;
  font-display: swap;

  /* This property is missing in Turbopack */
  src: url(/_next/static/media/eea71804552b3264-s.woff2) format('woff2');

  unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

I'll take a look to see if I can fix it myself 👀

[lfades]

Update: this issue only applies for thealpha versions of Tailwind. it works fine in the latest versions and when not using Tailwind.

[jonluca]

I'm seeing this with Next 15, next dev --turbo, and next/font with tailwind 3. The fonts 404 for me

[GuillaumeHalb]

I'm in 14.2.5 and I also have this issue. It's no big deal for me though, as it's only on dev mode

[mischnic]

This is caused by https://github.com/tailwindlabs/tailwindcss/issues/14951

[github-actions[bot]]

This closed issue has been automatically locked because it had no new activity for 2 weeks. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.