Autor:
    Aymeric PINEAU
    Erstellung:2026-01-21Letzte Aktualisierung:2026-01-21

    next-intlayer-Paket

    Das next-intlayer-Paket stellt die notwendigen Werkzeuge bereit, um Intlayer in Next.js-Anwendungen zu integrieren. Es unterstützt sowohl den App Router als auch den Page Router und bietet Middleware für locale-basiertes Routing.

    Installation

    bash
    npm install next-intlayer

    Exporte

    Middleware

    Import:

    tsx
    import "next-intlayer/middleware";
    FunktionBeschreibungZugehörige Dokumentation
    intlayerMiddlewareNext.js-Middleware, die lokalisierungsbasiertes Routing und Weiterleitungen handhabt. Erkennt die Locale aus Headern/Cookies und leitet zum entsprechenden Locale-Pfad weiter.intlayerMiddleware

    Konfigurations-Helfer

    Importieren:

    tsx
    import "next-intlayer/server";
    FunktionBeschreibungVerwandte Doku
    withIntlayerAsynchroner Helfer zum Umschließen der Next.js-Konfiguration, der sicherstellt, dass Intlayer-Dictionaries vor dem Build vorbereitet werden. Bereitet Content-Dateien vor und richtet webpack/SWC-Plugins ein.-
    withIntlayerSyncSynchroner Helfer zum Umschließen der Next.js-Konfiguration, ideal für Konfigurationen, in denen async nicht möglich oder gewünscht ist. Bereitet Dictionaries beim Serverstart nicht vor.-

    Provider

    Import:

    tsx
    import "next-intlayer";

    oder

    tsx
    import "next-intlayer/server";
    KomponenteBeschreibungZugehöriges Doc
    IntlayerClientProviderProvider für clientseitige Komponenten im Next.js App Router. Kapselt IntlayerProvider von react-intlayer.-
    IntlayerServerProviderProvider für serverseitige Komponenten in Next.js (App Router). Stellt auf dem Server den Locale-Kontext bereit.-
    IntlayerServerServerseitiger Wrapper für Intlayer-Inhalte im App Router. Gewährleistet korrektes Locale-Handling in Server Components.-
    HTMLProviderProvider für HTML-bezogene Internationalisierungseinstellungen. Ermöglicht Komponentenüberschreibungen für HTML-Tags.-
    HTMLRendererRendert HTML-Inhalte mit benutzerdefinierten Komponenten.-
    MarkdownProviderProvider für Markdown-Rendering-Kontext. Ermöglicht benutzerdefinierte Komponentenüberschreibungen für Markdown-Elemente.-
    MarkdownRendererRendert Markdown-Inhalte mit benutzerdefinierten Komponenten.-

    Hooks (Client-seitig)

    Import:

    tsx
    import "next-intlayer";

    Re-exportiert die meisten Hooks aus react-intlayer.

    HookBeschreibungVerwandtes Dokument
    useIntlayerClientseitiger Hook, der ein Wörterbuch anhand seines Schlüssels auswählt und dessen Inhalt zurückgibt. Verwendet die Locale aus dem Context, wenn keine angegeben ist.useIntlayer
    useDictionaryHook, der ein Wörterbuch-Objekt transformiert und den Inhalt für die aktuelle Locale zurückgibt. Verarbeitet t()-Übersetzungen, Enumerationen usw.useDictionary
    useDictionaryAsyncHook, der asynchrone Dictionaries verarbeitet. Akzeptiert eine auf Promises basierende Dictionary-Map und löst sie für die aktuelle locale auf.-
    useDictionaryDynamicHook, der dynamische Dictionaries behandelt, die per key geladen werden. Verwendet intern React Suspense für Ladezustände.-
    useLocaleClient-seitiger Hook, um die aktuelle Locale und eine Funktion zum Setzen derselben zu erhalten. Für den Next.js App Router erweitert und mit Navigationsunterstützung.useLocale
    usePathnameGibt den aktuellen Pfad ohne das Gebietsschema-Präfix und ohne Gebietsschema-Abfrageparameter zurück.usePathname
    useRewriteURLClient-seitiger Hook zur Verwaltung von URL-Umschreibungen. Aktualisiert die URL automatisch, wenn eine besser lesbare lokalisierte Umschreibregel existiert.useRewriteURL
    useLocalePageRouterSpezifischer Hook für den Next.js Page Router zur Verwaltung von Locales. Handhabt Weiterleitungen und Seiten-Neuladungen bei Locale-Änderungen.-
    useI18nHook, der eine Übersetzungsfunktion t() bereitstellt, um verschachtelte Inhalte per Schlüssel abzurufen. Orientiert sich am i18next/next-intl-Muster.useI18n
    useIntlHook, der ein an die Locale gebundenes Intl-Objekt bereitstellt. Injiziert automatisch die aktuelle Locale und verwendet optimiertes Caching.-
    useLoadDynamicHook zum Laden dynamischer Dictionaries mittels React Suspense. Nimmt einen key und ein promise entgegen und cached die Ergebnisse.-
    useHTMLRendererHook, um eine vorkonfigurierte HTML-Renderer-Funktion zu erhalten.-
    useMarkdownRendererHook, um eine vorkonfigurierte Markdown-Renderer-Funktion zu erhalten.-

    Funktionen (Serverseitig)

    Import:

    tsx
    import "next-intlayer/server";
    FunktionBeschreibungZugehöriges Dokument
    tServerseitige Version der Übersetzungsfunktion für den Next.js App Router. Gibt die Übersetzung mehrsprachiger Inhalte für die Server-locale zurück.translation
    getLocaleHilfsfunktion zum Extrahieren der aktuellen locale aus Next.js-Headern und Cookies. Entwickelt für Server Components, Server Actions oder Route Handlers.-
    generateStaticParamsGeneriert statische Parameter für Next.js' dynamische Routen basierend auf den konfigurierten Locales. Gibt ein Array von Locale-Objekten zur Vorab-Generierung zurück.-
    localeFunktion, um die Locale im Server-Kontext (App Router) zu lesen oder zu setzen. Stellt Locale-Verwaltung in Server Components bereit.-

    Typen

    Import:

    tsx
    import "next-intlayer";
    TypBeschreibung
    NextPageIntlayerTyp für Next.js-Seiten mit Intlayer-Unterstützung. Generischer Typ, der den locale-Parameter enthält.
    Next14PageIntlayerTyp für Next.js 14-Seiten mit Intlayer-Unterstützung.
    Next15PageIntlayerTyp für Next.js 15-Seiten mit Intlayer-Unterstützung.
    NextLayoutIntlayerTyp für Next.js-Layouts mit Intlayer-Unterstützung. Generischer Typ, der den locale-Parameter enthält.
    Next14LayoutIntlayerTyp für Next.js 14 Layouts mit Intlayer-Unterstützung.
    Next15LayoutIntlayerTyp für Next.js 15 Layouts mit Intlayer-Unterstützung.
    LocalParamsTyp für Next.js Routenparameter mit Locale. Objekt mit der Eigenschaft locale.
    LocalPromiseParamsTyp für Next.js Routenparameter mit Locale (async-Version). Promise, das zu einem Objekt mit der Eigenschaft locale aufgelöst wird.
    useRewriteURLintlayerMiddleware