Skip to content

next/font/google shim missing named exports for fonts like Figtree, DM_Sans, etc. #72

@solracnyc

Description

@solracnyc

Environment

  • vinext: 0.0.8 (also reproduced on 0.0.5)
  • Next.js: 16.1.6
  • Platform: Cloudflare Workers + vinext dev

Reproduce

  1. In any component (server or client): import { Figtree } from 'next/font/google'
  2. vinext build → fails with something like "Figtree" is not exported by ".../shims/font-google.ts"

Inter in a Server Component layout works fine because the shim does export it (or handles it as default).

Root cause

The font shim (source) does not export Figtree (or other Google Fonts like DM_Sans, Poppins, etc.) as named exports. Only a subset of fonts appear to be shimmed.

This affects any app using non-default Google Fonts via next/font/google named imports.

Workaround

Replace the next/font/google import with a CSS @import from Google Fonts CDN:

/* In your CSS module */
@import url('https://fonts.googleapis.com/css2?family=Figtree:wght@700&display=swap');

Then use font-family: 'Figtree', system-ui, sans-serif directly in CSS instead of the JS font object's className.

Suggested fix

Either generate named exports for all Google Fonts (matching Next.js behavior), or document the CSS @import workaround as the recommended approach for fonts beyond the currently shimmed set.

Verified on 0.0.8 — the font shim source still lacks these named exports.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions