Gestionar dependencias
Instalar dependenciasTipos de dependenciasReinstalar dependencias en un proyectoInstalar paquetes globalesEl comando npxListar paquetes instaladosGestión de versionesActualizar paquetesEliminar paquetes

<< NPM Automatizar tareas >>

Instalar dependencias

El comando para instalar un paquete en nuestro proyecto es npm install nombre-paquete. Si ejecutamos este comando por primera vez, veremos que creará un directorio llamado node_modules dentro del directorio de proyecto. Este directorio contendrá todos los paquetes instalados mediante npm (incluyendo a su vez las dependencias de dichos paquetes). Vamos a probar con Day.js.

npm i dayjs

Esto instalará por defecto la última versión estable de la librería Day.js (manejo de fechas) dentro del directorio node_modules. A partir de ahora podremos utilizarla en nuestro código:

import "./node_modules/dayjs/dayjs.min.js";

console.log(dayjs('2019-01-25').format('DD/MM/YYYY')); // '25/08/2023'

La importación de la librería en el código es todavía algo incómoda, ya que tenemos que buscar el archivo que contiene la librería, y básicamente estamos utilizándola como si la incluyéramos a mano en el HTML. Más adelante, veremos como optimizar esto con herramientas como Vite.

Tipos de dependencias

Por defecto, cuando instalamos una dependencia se instala como dependencia de ejecución. Una dependencia de ejecución es aquella que necesita el programa para poder ejecutarse en el navegador. Normalmente hablamos de una librería de JavaScript cuando nos referimos a esto. Existen también las dependencias de desarrollo, que son herramientas que únicamente utilizará el programador, como pueden ser compiladores (de TypeScript a JavaScript), empaquetadores como Webpack, Vite, ofuscadores de código, librerías de testing, etc.

Para instalar un paquete como dependencia de desarrollo usamos la opción -D o --save-dev:

npm i -D uglify-js

Ahora podemos ver como en el archivo package.json, tenemos registradas tanto las dependencias de ejecución (dependencies), como las de desarrollo (devDependencies):

{
  "name": "ejemplo",
  "version": "1.0.0",
  "description": "Proyecto de ejemplo",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "Arturo",
  "license": "ISC",
  "dependencies": {
    "dayjs": "^1.11.9"
  },
  "devDependencies": {
    "uglify-js": "^3.17.4"
  }
}

Reinstalar dependencias en un proyecto

El directorio node_modules se puede borrar en cualquier momento. De hecho, en los repositorios de código (Github por ejemplo), nunca se sube este directorio. Para volver a instalar las dependencias en cualquier momento, tanto para producción como para desarrollo, que aparecen en package.json, simplemente ejecutamos npm install.

Podemos instalar solo las dependencias de producción o solo las dependencias de desarrollo con npm install --only=prod, o npm install --only=dev.

Instalar paquetes globales

Ciertas herramientas o frameworks, como Angular o Nest, requieren la instalación de herramientas en el sistema para poder crear proyectos. Estos son paquetes globales que se instalan con la opción -g (ejemplo: npm i -g @angular/cli) Para saber donde se instalan estos paquetes ejecuta npm root -g.

Los paquetes globales contienen ejecutables (archivos JavaScript ejecutados bajo Node) que se registran para todo el sistema. Es decir, se pueden ejecutar desde la consola independientemente del directorio donde nos encontremos.

El comando npx

Para ejecutar la herramienta instalada localmente en el proyecto donde nos encontramos, bien sea porque queremos ejecutar la versión local en lugar de la global, o porque no la tenemos instalada de forma global, basta con poner el comando npx delante. Si no está instalada, la descargará y ejecutará. Ejemplo: npx uglify-js -mc archivo.js.

Listar paquetes instalados

Para poder ver los paquetes instalados en el directorio npm_modules escribiremos npm list. Si queremos ver en formato árbol, los paquetes que hay instalados y las dependencias que tiene cada uno de ellos, tenemos la opción --depth nivel. Donde nivel es la profundidad de dependencias a la que queremos descender.

Otra opciones bastante útil es incluir --include dev (lista sólo los paquetes en desarrollo), --include prod (solo los paquetes en producción), --long (muestra una descripción de cada paquete), o --global (lista paquetes globales).

Gestión de versiones

Por defecto, cuando instalamos un paquete, se instalará la última versión estable. Pero a veces, nuestro proyecto necesita incluir una versión anterior, por ejemplo, para soportar navegadores antiguos.

Las versiones de los paquetes normalmente tienen tres números X.Y.Z. La mayoría de paquetes siguen las reglas SemVer (Semantic Versioning) para aplicar la numeración. Las reglas son las siguientes:

  • Cuando la Z es incrementada, significa que un bug o problema ha sido solucionado, pero no se añade ninguna funcionalidad nueva.
  • Cuando la Y es incrementada, significa que nuevas funcionalidades han sido añadidas, pero que esto no afecta al código de las versiones previas (siempre que se mantenga la X). Por ejemplo, una aplicación hecha con la versión 2.2 debería seguir funcionando con la versión 2.5 (pero al revés no tiene por qué).
  • El número X se incrementará sólo si han habido suficientes cambios de forma que no se garantiza que las aplicaciones que utilicen versiones anteriores funcionen compatibles con la nueva. Por tanto debemos tener cuidado cuando hagamos una migración y vigilar los cambios que se han producido en la librería o framework.

Si queremos instalar una versión específica de una librería en lugar de la última versión, especificaremos la versión después del nombre del paquete: paquete@x.y.z. Ejemplos de posibilidades que tenemos:

  • npm i libreria@"2.5.3" → Instala la versión 2.5.3
  • "<2.0.0" → Instala la versión justo anterior a la 2.0.0
  • "*" ó "x" → Instala la última versión de un paquete (cuidado con los cambios que pueda tener esa versión y cómo nos puede afectar…).
  • "3" ó "3.x", ó "3.x.x" → Esto instala la última versión de un paquete siempre que sea 3.x.x (no se actualizará a la versión 4.x.x).
  • "^3.3.5" → Instalará la última versión 3 (3.x.x) de un paquete, pero como mínimo deberá ser la versión 3.3.5 (el carácter ^ significa que sólo el primer número, 3, debe respetarse). Este es el comportamiento por defecto de NPM
  • "3.3" ó "3.3.x" → Instalará la última versión 3.3.x de un paquete (nunca se actualizará a 3.4.x o posterior).
  • "~3.3.5" → Instalará la última versión de 3.3 (no actualizará a la 3.4 o superior) pero como mínimo deberá ser la versión 3.3.5 (el carácter ~ significa que los 2 primeros números, 3.3, deben respetarse). Equivale a "3.3.x".
  • latest → Instala la última versión estable.
  • next → Instala la que será la próxima versión estable, aunque todavía no lo es (beta, RC)

Actualizar paquetes

Para actualizar todas las dependencias de un proyecto ejecutaremos npm update . Mirará en el archivo package.json para ver a qué versiones se permite actualizar (por ejemplo, si la versión instalada es ^3.1.0 podrá actualizar a la 3.2.0 pero no a la 4.0.0). Para actualizar un paquete en concreto utilizaremos npm update paquete.

Si queremos instalar una versión más actual que la permitida en package.json, podemos volver a reinstalar el paquete con npm install (ejemplo: npm install paquete@latest), que instalará la versión especificada y actualizará el archivo package.json.

Eliminar paquetes

Para eliminar un paquete de nuestro proyecto teclearemos npm uninstall package. En lugar de uninstall podemos usar remove, rm, un, r o unlink para hacer lo mismo. Para desinstalar un paquete global usaremos la opción -g.

<< NPM Automatizar tareas >>