La generazione statica del sito pre-renderizza le pagine in fase di build, creando file HTML statici per ogni locale. Questo offre prestazioni eccellenti e vantaggi in ottica SEO, assicurando al contempo che tutti i contenuti tradotti siano disponibili immediatamente quando gli utenti visitano il tuo sito.

Router dell’app

Requisiti di configurazione

Per abilitare l’SSG con GT, ti servono:

1. App Router con instradamento tramite middleware - vedi la guida al middleware
2. Traduzioni locali - vedi la guida alle traduzioni locali
3. Import lato client - usa gt-next/client invece di gt-next

Passaggio 1: Configurazione di GTProvider

Posiziona GTProvider nel layout [locale] insieme alla funzione loadTranslations:

// app/[locale]/layout.tsx
import { GTProvider } from 'gt-next/client';
import { loadTranslations } from '@/loadTranslations';

export default async function RootLayout({ children, params }) {
  const { locale } = await params;
  
  return (
    <GTProvider loadTranslations={loadTranslations} locale={locale}>
      {children}
    </GTProvider>
  );
}

Passaggio 2: Usa le importazioni client

Importa tutti i componenti e gli hook di GT da gt-next/client:

// ✅ Usa gli import lato client per SSG
import { useGT, T } from 'gt-next/client';

// ❌ Questi impediscono l’SSG
import { getGT } from 'gt-next/server';
import { T } from 'gt-next';

Passaggio 3: Configura generateStaticParams

Assicurati di aver configurato generateStaticParams per le tue localizzazioni.

getLocale personalizzato

Per l’SSG, crea una funzione getLocale personalizzata che sia compatibile con la generazione statica:

Next.js 15.5+

// getLocale.ts
import { locale } from "next/root-params";
export default async function getLocale() {
  return await locale();
}

Next.js 15.1-15.4

// getLocale.ts  
import { unstable_rootParams } from "next/server";
export default async function getLocale() {
  return (await unstable_rootParams())?.locale;
}

Versioni precedenti

Purtroppo, nelle versioni precedenti non è possibile accedere ai parametri del percorso URL con SSG. Dovrai aggiornare a Next.js 15.1 o successivo.

Problemi comuni

Pagine non generate staticamente

Se le tue pagine non vengono generate staticamente, verifica che tutti i componenti e gli hook di GT importino da gt-next/client:

// ❌ Questi impediscono l’SSG
import { getGT } from 'gt-next/server';
import { getLocale } from 'gt-next/server';
import { getTranslations } from 'gt-next/server';
import { T } from 'gt-next';

// ✅ Questi sono compatibili con l’SSG
import { useGT, T } from 'gt-next/client';

Qualsiasi cosa che legga header o cookie impedirà la generazione statica.

Prossimi passi

• Archiviazione locale delle traduzioni - Necessaria per la configurazione SSG
• Guida al middleware - Necessaria per il routing delle lingue