La génération de site statique pré‑rend les pages lors du build, en créant des files HTML statiques pour chaque locale. Cela offre d’excellentes performances et des avantages en matière de SEO, tout en garantissant que l’ensemble du contenu de traduction est disponible immédiatement lorsque les utilisateurs visitent votre site.

Routeur d’applications

Conditions préalables

Pour activer le SSG avec GT, vous devez :

1. App Router avec routage via middleware — voir le guide du middleware
2. Traductions locales — voir le guide des traductions locales
3. Importations côté client — utilisez gt-next/client au lieu de gt-next

Étape 1 : configuration de GTProvider

Placez GTProvider dans votre layout [locale] avec la fonction 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>
  );
}

Étape 2 : utiliser les imports client

Importez tous les composants et hooks GT depuis gt-next/client :

// ✅ Utilisez les imports client pour le SSG
import { useGT, T } from 'gt-next/client';

// ❌ Ceux-ci empêchent le SSG
import { getGT } from 'gt-next/server';
import { T } from 'gt-next';

Étape 3 : Configurer generateStaticParams

Assurez-vous d’avoir configuré generateStaticParams pour vos locales.

getLocale personnalisé

Pour le SSG, créez une fonction getLocale personnalisée compatible avec la génération statique :

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;
}

Versions antérieures

Malheureusement, dans les versions antérieures, il n’existe aucun moyen d’accéder aux paramètres de chemin d’URL avec SSG. Vous devrez passer à Next.js 15.1 ou une version ultérieure.

Problèmes fréquents

Pages non générées statiquement

Si vos pages ne sont pas générées statiquement, vérifiez que tous les composants et hooks de GT importent depuis gt-next/client :

// ❌ Ceux-ci empêchent le SSG
import { getGT } from 'gt-next/server';
import { getLocale } from 'gt-next/server';
import { getTranslations } from 'gt-next/server';
import { T } from 'gt-next';

// ✅ Ceux-ci fonctionnent avec le SSG
import { useGT, T } from 'gt-next/client';

Tout ce qui lit les en-têtes ou les cookies empêchera la génération statique.

layout.tsx en dehors du répertoire [locale]

Si vous avez un fichier layout.tsx en dehors du répertoire [locale], cela empêchera la génération statique. Vous verrez probablement l’Error suivante :

L'export locale est introuvable dans le module [next]/root-params.js [app-rsc] (ecmascript).
Tous les exports du module sont connus de manière statique (il n'y a pas d'exports dynamiques). Par conséquent, il est établi de manière statique que l'export demandé n'existe pas.

Tous les files layout.tsx doivent se trouver dans le répertoire [locale]. Pour en savoir plus, consultez ce ticket Next.js connexe : Next.js issue.

Prochaines étapes

• Stockage local des traductions - Requis pour la configuration SSG
• Guide du middleware - Requis pour le routage par locale