Next.js i18n: stringid, milleni t() väljakutsed ei küüni

Kui teie Next.js rakendus on tõlgitud, aga brauseri vahekaart, 404-leht, vormivead ja lingi eelvaade on endiselt inglise keeles, on põhjus peaaegu alati sama: need stringid tekivad väljaspool komponenti, seega useTranslations kutse neid kunagi ei puudutanud. globalize.now on tehisintellektil põhinev lokaliseerimise infrastruktuur ja just see kiht jääb meie kogemuse järgi pooleli, kui AI agent lisab App Routeri projektile i18n: nähtav leht on teisendatud, ülejäänud pind mitte.

Allpool on kirjas, kus iga selline string asub ja milline next-intl kutse seda käsitleb. Kõik näited järgivad praegust next-intl dokumentatsiooni, mis on kätte saadud 2026-10-28.

Kus peituvad App Routeri rakenduses tõlkimata stringid?

Need peituvad kuues kohas, mis ei ole tekstu renderdavad React komponendid. Coding agent, mis lisab i18n, käies läbi teie komponente, teisendab nähtava UI ja kõnnib neist otse mööda:

1. Lehe pealkirjad ja kirjeldused failis generateMetadata.
2. Valideerimisvead ja tulemussõnumid Server Actionites.
3. not-found.tsx, 404-leht.
4. error.tsx, käitusaegne veaeleht.
5. Genereeritud failid, nagu opengraph-image.tsx, manifest.ts ja sitemap.ts.
6. Route Handlerid, mis tagastavad teksti.

Ühine joon on see, et ükski neist ei renderdu tavapärasel viisil teie [locale] layouti puu sees, seega tuleb lokaal neile ette anda või lugeda teisiti. Next.js 16 marsruutimise postitus käsitleb marsruutimise ühendust; see postitus räägib sellest, milleni see ühendus ei küüni.

Kuidas tõlkida lehe pealkirju ja kirjeldusi?

Kutsuge generateMetadata sees getTranslations paketist next-intl/server. Funktsiooni saab eksportida lehest või layoutist ja see on asünkroonne, seega on õige oodatav API:

// app/[locale]/page.tsx
import {getTranslations} from 'next-intl/server';

export async function generateMetadata() {
  const t = await getTranslations('Metadata');
  return {title: t('title'), description: t('description')};
}

Lõks on staatiline vorm. Agendid kirjutavad sageli export const metadata = {title: 'Dashboard'}, sest see on lühem, aga konstant ei saa tõlkefunktsiooni kutsuda. Teisendage see funktsioonivormiks ja lisage samad võtmed kataloogi iga lokaali jaoks. See on ka otsingule suunatud tekst, mistõttu rakenduse tõlkimine ilma selle metadata tõlkimata annab edetabelites vähe.

Kuidas tõlkida Server Actioni ja valideerimissõnumeid?

Andke lokaal actionile ette ja kutsuge getTranslations nii nimeruumi kui selle lokaaliga. Server Action ei tea, mis keeles leht on, seega palub next-intl dokumentatsioon teil see ette anda, näiteks argumendina:

'use server';
import {getTranslations} from 'next-intl/server';

export async function subscribe(locale: string, formData: FormData) {
  const t = await getTranslations({locale, namespace: 'Subscribe'});
  // ...validate, then return t('success') or t('invalidEmail')
}

Üks hoiatus samast dokumentatsioonist: mõelge, mis juhtub, kui külastaja saab keelt vahetada ajal, mil actioni sõnum on ekraanil. URL-is oleva [locale] segmendiga käsitletakse seda automaatselt, sest marsruut muutub. Ilma selleta võiksite sõnumi ise tühjendada, näiteks andes komponendile key={locale}, et selle olek lähtestuks.

Zodiga vormide valideerimisel on dokumenteeritud lähenemine veakaart. Zod aktsepteerib ühe iga safeParse kutse kohta ja kaart võib kutsuda getTranslations. Pange see ühte asünkroonsesse abifunktsiooni ja andke selle tulemus igal parse'il edasi error valikuna. Siis sisaldavad teie skeemid reegleid, mitte ingliskeelseid lauseid, ja AI loodud vormid ei saada enam "Invalid email" läti keelsele lehele.

Kuidas tõlkida 404- ja vealehti?

Pange not-found.tsx faili app/[locale]/ sisse ja lisage catch-all, et see tegelikult käivituks. Next.js renderdab selle faili, kui segment kutsub notFound(), ja tundmatu URL ei kutsu seda ise välja:

// app/[locale]/[...rest]/page.tsx
import {notFound} from 'next/navigation';

export default function CatchAllPage() {
  notFound();
}

Päringutel, mida next-intl middleware ei hõlma, pole lokaali üldse, seega [locale] 404 neile kunagi ei kehti. Dokumentatsiooni vastus on app/global-not-found.tsx, mida Next.js dokumentatsioon nimetab eksperimentaalseks ja mis renderdab oma html ja body. Tundmatu [locale] väärtuse puhul soovitab dokumentatsioon kutsuda notFound(), tavaliselt failis i18n/request.ts.

error.tsx on teistsugune. Next.js nõuab, et see oleks Client Component, ja see renderdub teie layouti all, seega vajab see NextIntlClientProvider, mis kannab vähemalt Error nimeruumi. Andke edasi ainult need sõnumid, mitte kogu kataloog:

// app/[locale]/layout.tsx (excerpt)
const messages = await getMessages();
// ...
<NextIntlClientProvider locale={locale} messages={pick(messages, 'Error')}>

Siis töötab useTranslations('Error') faili error.tsx sees. Leht ei hõlma faili global-error, seega kontrollige seda faili käsitsi, kui teil see on.

Mis saab jagamispiltidest, manifestist ja sitemapist?

Igaüks neist vajab lokaali ette andmist, sest need asuvad väljaspool layouti puud. opengraph-image.tsx puhul lugege locale väärtusest params ja kutsuge getTranslations({locale, namespace}). Kohandatud localePrefix puhul hoiatab dokumentatsioon, et genereeritud marsruut võib muutuda kättesaamatuks, sest Next.js ei näe proxy (middleware) ümberkirjutusi; lahendus on panna matcher vahele jätma teid, mis lõpevad opengraph-image.

app/manifest.ts asub väljaspool [locale], seega ei saa next-intl teelt lokaali tuletada. Valige esindav lokaal, tavaliselt vaikelokaal, ja andke see selgesõnaliselt edasi. sitemap.ts puhul lisage alternates.languages kirjed ja koostage iga URL oma navigatsioonimooduli asünkroonse getPathname({locale, href}) abil, lisades ette hosti. next-intl saadab vaikimisi ka link vastusepäise, mis kuulutab keeleversioonid välja; saidikaart on valik, kui vajate kontrolli CMS-põhiste slugide üle.

Kuidas käsitleda Route Handlereid?

Võtke lokaal otsinguparameetrist, segmendist või accept-language päisest, valideerige see hasLocale(routing.locales, locale) abil ja tagastage ebaõnnestumisel 400. Seejärel kutsuge getTranslations({locale, namespace}). Valideerimise vahelejätmine tähendab, et suvaline string jõuab teie kataloogi otsinguni.

Kuidas leida üles ingliskeelne tekst, mille teie agent maha jättis?

Käivitage need projekti juurkaustast. Need on meelega ligikaudsed; eesmärk on loetav nimekiri, mitte hinne.

# 1. Static metadata that cannot be translated
grep -rn "export const metadata" app

# 2. Titles and descriptions already in generateMetadata
grep -rn "title:" app --include=page.tsx --include=layout.tsx

# 3. Server Actions with literal return messages
grep -rln "use server" app src 2>/dev/null | xargs grep -n "message:\|error:"

# 4. Zod schemas with inline messages
grep -rn "message:\s*['\"]" app src 2>/dev/null

# 5. 404 and error files, and whether a catch-all exists
ls app/\[locale\]/not-found.tsx app/\[locale\]/error.tsx "app/[locale]/[...rest]/page.tsx" 2>&1

Kõik esimese nelja tulemuse seas olevad tavalised ingliskeelsed literaalid kuuluvad kataloogi. Miks agendid lisavad pidevalt kõvakodeeritud sõnesid selgitab, miks see kordub: agent järgib nähtavat mustrit ja nähtav muster on komponent. Kui kasutate Copilotit, kehtivad siin ka Copiloti juhisefailide piirangud.

Mida see teie kataloogis muudab?

See lisab võtmeid ja võtmetes algab triiv. Iga ülaltoodud punkt toob kataloogi uusi kirjeid, nagu Metadata, Error, Subscribe ja valideerimissõnumid, ning igaüks vajab tõlget igas lokaalis, mida te toetate. Projekt, mis tõlgib oma komponendid korra ja lisab hiljem Server Actioni või uue lehe pealkirja, on sama projekt, mida kirjeldab artikkel miks tõlkefailid lähevad sünkroonist välja.

next-intl serveerib tõlkeid käitusajal ja me ei asenda seda. globalize.now asub ühe kihi kõrgemal: ühendate hoidla rakenduses, koodibaas teisendatakse korra kataloogiks ning push-tööd tõlgivad uusi kataloogiühikuid nende ilmumisel, kohale toimetatuna muudatustena, mida te üle vaatate. Next.js integratsioon kirjeldab seadistust ja mida me olemasolevas i18n seadistuses puudutame ja mida mitte käsitleb juhtu, kus next-intl on juba käsitsi ühendatud.

Kust alustada

Käivitage need viis grep'i, teisendage iga staatiline metadata eksport, lisage catch-all marsruut ja andke error.tsx oma provider. Seejärel kontrollige kataloogist uusi nimeruume igas lokaalis. Kui saatsite välja tehisintellektiga loodud rakenduse ja soovite, et teisenduse ja tõlkimise eest hoolitsetaks teie eest, mitte et peaksite neid ise haldama, on vibe coderite leht ülevaade, arendajadokumentatsioon katab agentide seadistused ja hinnastus on eraldi lehel.