Skip to main content Link Menu Expand (external link) Document Search Copy Copied

NPM

Contenidos
  1. Introducción a NPM
  2. Linea de comandos
  3. package.json & package-lock.json
  4. Dependencias de desarrollo
    1. Experimento 1
  5. Iniciar NPM en un proyecto Javascript
    1. Experimento 2
  6. NPX y NPM Scripts
    1. Experimento 3
  7. Resolviendo una dependencia a través de Github
  8. Registro y publicación en el repositorio público
  9. Npm Audit
    1. Ver la última versión disponible
    2. Forzar la resolución de dependencias para una auditoría
      1. ¿Qué otras cosas podemos hacer?

Introducción a NPM

NPM nos permite compartir y reutilizar códigos escritos por nosotros o por otros desarrolladores.

www.npmjs.com es el sitio de este proyecto y cualquier persona puede publicar módulos. Hay algunos muy valiosos, pero como cualquiera pude publicar, hay algunos no muy útiles y debemos ser cuidadosos al momento de seleccionar las dependencias de nuestros proyectos.

Podemos encontrar dependencias para Node y también para el Navegador, IoT y cualquier entorno donde Javascript puede ser ejecutado.

Un proyecto fácilmente puede tener cientos de dependencias y algunas de ellas pueden ser frameworks completos y otros librerías pequeñas.

NPM es ahora una de las herramientas fundamentales en el desarrollo Javascript.

Un NPM package o paquete (módulo) es una carpeta con archivos Javascript que Node puede ejecutar. Cuando tenemos muchas carpetas necesitamos gestionarlas de alguna forma ya que cada una de estas carpetas puede tener sus propias dependencias.

NPM puede se puede referir al Sito www.npmjs.com o a la herramienta de línea de comandos NPM que nos permite trabajar con las dependencias.

Linea de comandos

La herramienta de línea de comandos NPM viene con Node, por lo que no es necesario instalar nada adicional para usar este gestor de módulos o paquetes.

NPM se actualiza más frecuentemente que Node, por lo que es posible que tengamos que actualizar NPM manualmente para obtener las últimas actualizaciones. Podemos revisar la versión instalada con el comando npm -v

Para actualizar NPM usamos el comando

  npm install -g npm

…Es decir, usamos NPM para actualizar NPM.

Para instalar dependencias usamos el comando npm install o su atajo (shortcut) npm i. Por defecto bajará la dependencia solicitada el sitio principal NPM Registry (aunque podríamos configurarlo para que lo haga desde otro lugar).

NPM instala directamente la dependencia bajo la carpeta node_modules. Esta carpeta es el lugar por defecto dónde Node buscará los módulos incorporados en nuestros scripts con la función require.

Cuando se instala un dependencia en un directorio, NPM documenta esta dependencia en este archivo y además instala todas las subdependencias que se requieran.

package.json & package-lock.json

En el desarrollo con Node el archivo package.json cumple varias funciones. En primer lugar tiene información básica del proyecto, como su nombre y versión. También lista las dependencias en dos secciones principales. Las dependencias necesarias en el entorno de desarrollo (devdependencies) y en el entorno productivo (dependencies). Además tiene los comandos que podemos ejecutar con NPM en la sección scripts (más de esto pronto) y con ayuda de otros paquetes como cosmiconfig también podemos entregar configuración adicional para algunas dependencias del mismo proyecto como en el caso del framework de pruebas Jest (Ej: En el módulo 4 configuramos el entorno jsdom para jest en el archivo package.json).

NPM logra que instalar las dependencias de un proyecto sea un procesos repetible, por lo que no es necesario compartir la carpeta node_modules con nuestro equipo ya que con el el archivo package.json se puede regenerar la carpeta node_modules con todas las dependencias y subdependencias requeridas por el proyecto.

Por otro lado, el archivo package-lock.json representa el árbol (nuevamente esta estructura) de dependencias con las versiones exactas para que reconstruir las dependencias con las mismas versiones sea un proceso repetible.

También resuelve el árbol y lo deja en un solo nivel calculando las dependencias comunes entre diferentes paquetes.

Dependencias de desarrollo

Para instalar dependencias solo en el entorno de desarrollo podemos lograrlo con la opción --save-dev o su atajo (shortcut) -D. Por ejemplo: npm install -D nodemon. En entornos de integración contínua o en entornos productivos donde no se requiere instalar dependencias de desarrollo, podemos utilizar la opción --production para solo instalar esas dependencias.

Experimento 1

Intenta crear un directorio vacío y luego ejecutar npm install bootstrap#4.0.0. Experimentaremos eliminando la carpeta node_modules y el archivo package-lock.json

Iniciar NPM en un proyecto Javascript

Podemos utilizar el comando npm init que nos llevará por un procesos de generación de un archivo package.json. Es común utilizar la opción --force o su shortcut -f para forzar las opciones por defecto.

Experimento 2

Intenta crear un directorio vacío y luego ejecutar npm init. Podemos borrar todo y ahora probar npm init -f y analizar sus resultados

NPX y NPM Scripts

NPX es otro binario que viene con NPM y es muy útils para automatizar la forma en que los equipos utilizan paquetes y proyectos con NPM.

En nuestro caso, para no instalar globalmente eslint para ejecutar el comando –init podemos lograrlo usando npx con el siguiente comando: npx cypress -v

Experimento 3

Intenta crear un directorio vacío y luego ejecutar npm init. Podemos borrar todo y ahora probar npm init -f y analizar sus resultados

Resolviendo una dependencia a través de Github

Podrás notar como en el archivo package.json tenemos la dependencia number2words apuntando hacia un repositorio git con el nombre de la librería + un espcio para poner tu nombre de usuario. Además de esto podemos ver como después del signo # vemos el número de la versión que actualmente es v1.0.0.

Lo primero que haremos será entrar a Github y nos dirigimos al repositorios Number2Words. Una vez en él presionaremos en el botón “Fork”.

Ahora nos dirigimos al repositirio del Laboratorio 16 y ejecutamos npm install. Veremos como aún obtenemos un error pero relacionado a la versión de la librería.

Vamos a clonar el proyecto localmente y una vez navegando hacia el desde la terminal, primero verificaremos cual es la versión actual publicada en package.json y package-lock.json y la fijaremos en la 1.0.0. Luego ejecutaremos el comando git tag v1.0.0 y luego el comando git push origin -tags. Con esto lograremos que el último commit quede “taggeado” o marcado con el número de versión indicado en el comando anterior. Esto lo podemos verificar con el comando git log que nos indicará cual es el commit relacionado a la v1.0.0

Una vez realizado estos pasos ya podrás descargar la dependencian sin problemas desde el directorio del laboratorio.

Registro y publicación en el repositorio público

Lo primero es crearse una cuenta en NPM en el siguiente enlace. Una vez confirmado el Email, ya estaremos habilitados para subir paquetes al registro público.

En el repositorio que queremos publicar agregaremos un nuevo Tag pero esta vez a través de un proceso más automatizado a través del comando npm version. Para conocerlo mejor ejecutamos npm version --help para analizar las opciones disponibles.

Ahora en el directorio deseado ejecutaremos npm login y una vez todo OK, ejecutaremos npm publish.

Npm Audit

Vamos a conocer 2 comandos interesantes. El primero es npm audit que no ayudará a mostrar en la salida de la terminal información relevante a través de un reporte de seguridad de los paquetes instalados. Vamos a revisar los links para los módulos marcados con severidad "High".

Ahora intentaremos solucionar los problemas ejecutando npm audit fix. De no funcionar podemos ejecutar npm audit fix --force y esto forzará a la resolución de las dependencias que puedan tener conflicto. Debemos tener cuidado con esto ya que eventualmente algún paquete podría no funcionar correctamente.

Ver la última versión disponible

Para poder ver la más actual de un paquete podemos hacer algo como lo siguiente:

npm view tar version

En este ejemplom vemos la última versión disponible del paquete tar e información relevante del módulo

Para ver la version instalada de un determinado paquete podemos hacer algo como:

npm ls tar

Forzar la resolución de dependencias para una auditoría

En general el comando npm audit fix no siempre logrará resolver y forzar todas las dependencias. Para forzarlo existe el proceso llamado Shrinkwrap en el cual debemos seguir un modelo específico de especificación de los módulos. Más detalle se su uso en el siguiente enlace

Para utilizarlo ejecutaremos el comando

npm shrinkwrap

seguiremos el siguiente modelo apoyados de npm ls y del siguiente modelo:

{
    "dependencies": {
        "A": {
            "version": "actual-version",
            "dependencies": {
                "B": { 
                  "version": "actual-version",
                  "dependencies": {
                    "c": {
                      "version": "PATCH-VERSION"
                    }
                  }
                }
            }
        }
    }
}

modificaremos a mano shrinkwrap

buscar paquete afectado y cambiar version una major hacia arriba rm -rf node_modules npm ls <package> npm test npm run dev

Probamos hasta estar seguros que funciona.

Por última vez nos aseguramos que ya no hay vulnerabilidades con el comando de audit:

  npm audit

¿Qué otras cosas podemos hacer?

Más información de todo lo que podemos lograr en este link