Migracja z next-intl do Intlayer

Aby zapoznać się z kompletnym i szczegółowym samouczkiem krok po kroku, zapraszamy do naszego pełnego Przewodnika migracji z next-intl.

Migracja z next-intl do Intlayer pozwala ci utrzymać routing aplikacji i składnię całkowicie niezakłócone.

Co zrobić

Wykonaj następujące polecenie w swoim repozytorium:

npx intlayer init

To będzie tworzyć intlayer.config.ts. W swoim next.config.ts, użyj opakowania wtyczki aby bezproblemowo wstrzyknąć aliasy next-intl do @intlayer/next-intl.

import type { NextConfig } from "next";import { createNextIntlPlugin } from "@intlayer/next-intl/plugin";const withIntlayer = createNextIntlPlugin();const nextConfig: NextConfig = {};export default withIntlayer(nextConfig);

Co się dzieje za kulisami

Opakowywacz bundlera zastępuje tłumaczenia, ale pozostawia funkcje next-intl/navigation nienaruszone (np. Link, redirect, usePathname).

Za kulisami:

• Runtime ICU: Liczby mnoga (=0, one, other), select/selectordinal, argumenty # i sformatowane argumenty ({ts, date, long}) działają poprawnie używając wspólnego resolveMessage(..., 'icu') resolver.
• useTranslations() & getTranslations(): Wywołania zakresu bare wyodrębniają pierwszy segment klucza jako prawidłowy identyfikator słownika. Zagnieżdżone przestrzenie nazw łagodnie dzielą się na ścieżki słownika i prefiksy.
• Formatowanie bogate: Zarówno t.rich() jak i t.markup() są w pełni natywnie implementowane, konwertując węzły podobne do HTML na wyrenderowane fragmenty React.
• useFormatter: relativeTime, list, dateTimeRange i nazwane formaty z konfiguracji mostu do podstawowych natywnych Intl formatów.