devIndicators

devIndicators te permite configurar el indicador en pantalla que proporciona contexto sobre la ruta actual que estás viendo durante el desarrollo.

  devIndicators: false | {
    position?: 'bottom-right'
    | 'bottom-left'
    | 'top-right'
    | 'top-left', // por defecto 'bottom-left',
  },

Establecer devIndicators en false ocultará el indicador, sin embargo Next.js continuará mostrando cualquier error de compilación o tiempo de ejecución que se encuentre.

Solución de problemas

El indicador no marca una ruta como estática

Si esperas que una ruta sea estática y el indicador la ha marcado como dinámica, es probable que la ruta haya optado por no usar el renderizado estático.

Puedes confirmar si una ruta es estática o dinámica construyendo tu aplicación usando next build --debug, y verificando la salida en tu terminal. Las rutas estáticas (o pre-renderizadas) mostrarán un símbolo ○, mientras que las rutas dinámicas mostrarán un símbolo ƒ. Por ejemplo:

Route (app)                              Size     First Load JS
┌ ○ /_not-found                          0 B               0 kB
└ ƒ /products/[id]                       0 B               0 kB

○  (Estática)   pre-renderizado como contenido estático
ƒ  (Dinámica)  renderizado en el servidor bajo demanda

Hay dos razones por las que una ruta podría optar por no usar el renderizado estático:

• La presencia de APIs dinámicas que dependen de información en tiempo de ejecución.
• Una solicitud de datos no almacenada en caché, como una llamada a un ORM o controlador de base de datos.

Verifica tu ruta en busca de cualquiera de estas condiciones, y si no puedes renderizar estáticamente la ruta, entonces considera usar loading.js o <Suspense /> para aprovechar el streaming.

Historial de versiones