En este artículo, analizamos cómo create-next-app valida el nombre de tu proyecto.

validate: (name) => {
 const validation = validateNpmName(basename(resolve(name)))
 if (validation.valid) {
   return true
 }
 return 'Invalid project name: '   validation.problems[0]
},

¿Has intentado nombrar tu proyecto con espacios cuando usas el comando create-next-app? si lo has hecho, no permitirá espacios en tu proyecto porque sigue ciertos principios a la hora de nombrar tu proyecto.

Entonces, ¿cuáles son estas reglas de convención de nomenclatura?

validar la función NpmName

Si marca create-next-app/index.ts, llama a una función llamada validarNpmName. Esto se importa desde helpers/validate-pkg.ts

Esta función es sencilla, llama a una función llamada validarProjectName que se importa desde validar-npm-paquete-nombre.

La documentación dice que si un nombre es válido, obtendrás el siguiente objeto de vuelta:

{
 validForNewPackages: true,
 validForOldPackages: true
}

¿Qué hace que un nombre sea válido? revisemos la documentación nuevamente. La documentación proporciona estas reglas de nomenclatura:

1. la longitud del nombre del paquete debe ser mayor que cero

2. todos los caracteres en el nombre del paquete deben estar en minúsculas, es decir, no se permiten nombres en mayúsculas ni en mayúsculas mixtas

3. el nombre del paquete puede estar formado por guiones

4. el nombre del paquete no debe contener caracteres que no sean seguros para URL (ya que el nombre termina siendo parte de una URL)

5. el nombre del paquete no debe comenzar con . o _

6. el nombre del paquete no debe contener espacios

7. el nombre del paquete no debe contener ninguno de los siguientes caracteres: ~)('!*

8. el nombre del paquete no puede ser el mismo que el de un módulo principal de node.js/io.js ni un nombre reservado o incluido en la lista negra. Por ejemplo, los siguientes nombres no son válidos:
   
   —http
   
   - arroyo
   
   — módulos_nodo
   
   — favicon.ico

9. la longitud del nombre del paquete no puede exceder 214

Estas son las reglas que debes tener en cuenta al nombrar tu proyecto Next.js.

Sobre nosotros:

En Think Throo, tenemos la misión de enseñar los conceptos arquitectónicos avanzados de base de código utilizados en proyectos de código abierto.

10 veces tus habilidades de codificación practicando conceptos arquitectónicos avanzados en Next.js/React, aprende las mejores prácticas y crea proyectos de nivel de producción.

Somos de código abierto: https://github.com/thinkthroo/thinkthroo (¡Danos una estrella!)

También brindamos servicios de desarrollo web y redacción técnica. Comuníquese con nosotros en [email protected] para obtener más información.

Referencias:

1. https://github.com/vercel/next.js/blob/canary/packages/create-next-app/index.ts#L162

2. https://github.com/vercel/next.js/blob/canary/packages/create-next-app/helpers/validate-pkg.ts#L13

3. https://www.npmjs.com/package/validate-npm-package-name

4. https://github.com/npm/validate-npm-package-name/tree/main