Directorio src
Como alternativa a tener los directorios especiales app
o pages
de Next.js en la raíz de tu proyecto, Next.js también admite el patrón común de colocar el código de la aplicación bajo la carpeta src
.
Esto separa el código de la aplicación de los archivos de configuración del proyecto que generalmente se encuentran en la raíz, lo cual es preferido por algunos individuos y equipos.
Para usar la carpeta src
, mueve la carpeta del Enrutador app
o del Enrutador pages
a src/app
o src/pages
respectivamente.

Es bueno saber:
- El directorio
/public
debe permanecer en la raíz de tu proyecto.- Los archivos de configuración como
package.json
,next.config.js
ytsconfig.json
deben permanecer en la raíz del proyecto.- Los archivos
.env.*
deben permanecer en la raíz del proyecto.src/app
osrc/pages
serán ignorados siapp
opages
están presentes en el directorio raíz.- Si estás usando
src
, probablemente también moverás otras carpetas de la aplicación como/components
o/lib
.- Si estás usando Middleware, asegúrate de colocarlo dentro de la carpeta
src
.- Si estás usando Tailwind CSS, necesitarás agregar el prefijo
/src
en la sección de contenido del archivotailwind.config.js
(ver documentación de configuración de contenido).- Si estás usando rutas TypeScript para importaciones como
@/*
, debes actualizar el objetopaths
entsconfig.json
para incluirsrc/
.