devIndicators

devIndicators vous permet de configurer l'indicateur à l'écran qui fournit du contexte sur la route actuelle pendant le développement.

  devIndicators: false | {
    position?: 'bottom-right'
    | 'bottom-left'
    | 'top-right'
    | 'top-left', // par défaut 'bottom-left',
  },

Définir devIndicators sur false masquera l'indicateur, mais Next.js continuera à afficher les erreurs de build ou d'exécution rencontrées.

Dépannage

L'indicateur ne marque pas une route comme statique

Si vous vous attendez à ce qu'une route soit statique et que l'indicateur l'a marquée comme dynamique, il est probable que la route ait opté pour un rendu non statique.

Vous pouvez confirmer si une route est statique ou dynamique en construisant votre application avec next build --debug, et en vérifiant la sortie dans votre terminal. Les routes statiques (ou pré-rendues) afficheront un symbole ○, tandis que les routes dynamiques afficheront un symbole ƒ. Par exemple :

Route (app)                              Taille     Premier chargement JS
┌ ○ /_not-found                          0 B               0 kB
└ ƒ /products/[id]                       0 B               0 kB

○  (Statique)   pré-rendu comme contenu statique
ƒ  (Dynamique)  rendu côté serveur à la demande

Il y a deux raisons pour lesquelles une route pourrait opter pour un rendu non statique :

• La présence d'API dynamiques qui dépendent d'informations d'exécution.
• Une requête de données non mise en cache, comme un appel à un ORM ou un pilote de base de données.

Vérifiez votre route pour ces conditions, et si vous ne pouvez pas rendre la route statiquement, envisagez d'utiliser loading.js ou <Suspense /> pour tirer parti du streaming.

Historique des versions