Statische Assets | Next.js Deutsch

Next.js kann statische Dateien wie Bilder aus einem Ordner namens public im Stammverzeichnis bereitstellen. Dateien innerhalb von public können dann in Ihrem Code ausgehend von der Basis-URL (/) referenziert werden.

Wenn Sie beispielsweise me.png in public ablegen, kann der folgende Code auf das Bild zugreifen:

Avatar.js

import Image from 'next/image'

export function Avatar() {
  return <Image src="/me.png" alt="me" width="64" height="64" />
}

Dieser Ordner ist auch nützlich für robots.txt, favicon.ico, Google Site Verification und andere statische Dateien (einschließlich .html). Achten Sie jedoch darauf, keine statische Datei mit demselben Namen wie eine Datei im pages/-Verzeichnis zu haben, da dies zu einem Fehler führt. Mehr erfahren.

Wichtig zu wissen:

Das Verzeichnis muss public heißen. Der Name kann nicht geändert werden und es ist das einzige Verzeichnis, das für statische Assets verwendet wird.

Nur Assets, die sich zum Zeitpunkt des Builds im public-Verzeichnis befinden, werden von Next.js bereitgestellt. Dateien, die zur Laufzeit hinzugefügt werden, sind nicht verfügbar. Für persistente Dateispeicherung empfehlen wir einen Drittanbieterdienst wie AWS S3.