Comprendre les exportations statiques de Next.js

Next.js offre un moyen puissant de générer des sites web entièrement statiques. En définissant output: 'export' dans votre next.config.js (ou en le forçant avec export const dynamic = 'error'), vous garantissez que toutes les pages sont pré-rendues au moment de la compilation.

Pourquoi les exportations statiques ?

1. Performance : Les fichiers HTML statiques se chargent instantanément.
2. Sécurité : Aucune logique de base de données ou de serveur n'est exposée à l'exécution.
3. Hébergement : Peut être déployé n'importe où (Cloudflare Pages, GitHub Pages, Vercel, S3).

Exemple de configuration

Voici comment vous pourriez configurer une page exportée statiquement :

// app/page.tsx
export const dynamic = 'error';

export default function Home() {
  return <h1>Hello, Static World!</h1>;
}

Notez le paramètre dynamic = 'error'. Si un composant dans l'arborescence tente de lire des données au moment de la requête (comme les paramètres de recherche ou les cookies), la compilation échouera immédiatement au lieu de se rabattre sur un rendu dynamique. Ceci est crucial pour maintenir des garanties de performance.