Skip to content

Build fails with Unexpected token in layout.tsx (default create-next-app next/font/google) #751

@kingRayhan

Description

@kingRayhan

Description

vinext build fails on a stock create-next-app App Router project whose root app/layout.tsx uses next/font/google (Geist and Geist_Mono with subsets: ["latin"]). This is the default scaffold many users start from, so the failure blocks a straightforward migration to vinext.

Reproduction

Repository: https://github.com/kingRayhan/vinext-poc

git clone https://github.com/kingRayhan/vinext-poc.git
cd vinext-poc
bun install
bun run build

Actual behavior

Build fails during [1/5] analyze client references... with:

[builtin:vite-transform] Error: Unexpected token
 -  in app/layout.tsx at 234..235

(The reported span lines up with the second Geist_Mono({ ... }) call in the default layout.)

Expected behavior

vinext build completes successfully, matching the documented support for next/font/google (CDN / runtime loading per README).

Environment

  • vinext ^0.0.38
  • vite ^8.0.3
  • @vitejs/plugin-rsc ^0.5.21
  • react / react-dom 19.2.4

Suspected cause (optional)

The vinext:google-fonts build transform that injects _selfHostedCSS appears to insert , _selfHostedCSS before the closing } of the font options object. When the object uses a trailing comma after the last property (as create-next-app formats it), the result can contain a double comma (, ,), which would explain the parse error at the start of the injected property.

If that diagnosis is wrong, the repro repo should still be enough to trace the real failure in packages/vinext (e.g. plugins/fonts).

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions