Navegadores compatibles

Next.js soporta navegadores modernos sin necesidad de configuración.

• Chrome 64+
• Edge 79+
• Firefox 67+
• Opera 51+
• Safari 12+

Browserslist

Si deseas enfocarte en navegadores o características específicas, Next.js soporta configuración de Browserslist en tu archivo package.json. Next.js utiliza la siguiente configuración de Browserslist por defecto:

{
  "browserslist": [
    "chrome 64",
    "edge 79",
    "firefox 67",
    "opera 51",
    "safari 12"
  ]
}

Polyfills

Inyectamos polyfills ampliamente utilizados, incluyendo:

• fetch() — Reemplaza: whatwg-fetch y unfetch.
• URL — Reemplaza: el paquete url (API de Node.js).
• Object.assign() — Reemplaza: object-assign, object.assign y core-js/object/assign.

Si alguna de tus dependencias incluye estos polyfills, se eliminarán automáticamente del build de producción para evitar duplicación.

Además, para reducir el tamaño del bundle, Next.js solo cargará estos polyfills para navegadores que los requieran. La mayoría del tráfico web global no descargará estos polyfills.

Polyfills personalizados

Si tu propio código o alguna dependencia externa de npm requiere características no soportadas por tus navegadores objetivo (como IE 11), necesitarás agregar polyfills manualmente.

En este caso, debes agregar una importación de nivel superior para el polyfill específico que necesites en tu Custom <App> o en el componente individual.

Características de JavaScript

Next.js te permite usar las últimas características de JavaScript sin configuración adicional. Además de características ES6, Next.js también soporta:

• Async/await (ES2017)
• Propiedades Rest/Spread de objetos (ES2018)
• import() dinámico (ES2020)
• Encadenamiento opcional (ES2020)
• Fusión nula (ES2020)
• Campos de clase y propiedades estáticas (parte de la propuesta stage 3)
• ¡y más!

Polyfills del lado del servidor

Además de fetch() en el lado del cliente, Next.js incluye polyfills para fetch() en entornos Node.js donde aún no está disponible. Utiliza undici, la misma implementación que usa Node.js. Puedes usar fetch() en tu código de servidor (como getStaticProps/getServerSideProps) sin necesidad de polyfills como isomorphic-unfetch o node-fetch.

Características de TypeScript

Next.js tiene soporte integrado para TypeScript. Aprende más aquí.

Personalización de la configuración de Babel (Avanzado)

Puedes personalizar la configuración de Babel. Aprende más aquí.