next-zonesAssets: fonts, images, public files
Fonts#
next/font works in a zone as it does in any app: the font is preloaded, and its CSS comes with the zone's styles.
import localFont from "next/font/local";
const zoneFont = localFont({ src: "./fonts/my-font.woff2" });
Images#
next/image works with the zone's own local images:
- imported images (
import hero from "./hero.png"); - files from the zone's
public/(src="/blog/logo.png").
The image optimizer uses the shell's images settings: sizes, formats, remote patterns. Put remote patterns
that a zone needs in the shell's config. A zone that sets no images config fits any shell. A key a zone sets of its own
(not left at Next's default; set to Next's default, it counts as unset) and that differs from the shell's is refused at install today; zone-level image config is
planned.
Public files#
A zone's public/ files must live under its mount:
blog/public/blog/logo.png → served at /blog/logo.png ✓
blog/public/favicon.ico → refused: outside the zone's mount
The root (/favicon.ico, /robots.txt…) belongs to the shell. A public file takes precedence over a dynamic route
at the same URL, as in Next.