CarlosSeijas
← Volver a los blogs

NPM: Guía Completa para Desarrolladores JavaScript

Código
npmJavaScriptDesarrolloGestión de paquetes
NPM: Guía Completa para Desarrolladores JavaScript

¿Por qué NPM se volvió mi mejor amigo?

¿Alguna vez has necesitado hacer algo específico en tu proyecto y te has preguntado si alguien ya lo habrá resuelto? Pues déjame contarte que probablemente sí, y está en npm. Después de años programando, puedo decirte que npm no es solo una herramienta más - es básicamente el supermercado de código más grande del mundo.

Cuando empecé a programar, me la pasaba escribiendo todo desde cero. ¿Un validador de emails? Lo hacía yo. ¿Una función para formatear fechas? También. Era como querer construir un auto empezando por fundir el metal. Ahora sé que eso es reinventar la rueda, y npm es precisamente la solución.

En este artículo te voy a enseñar todo lo que necesitas saber sobre npm. No solo npm install, sino también los comandos que realmente van a cambiar tu forma de trabajar.

¿Qué es NPM? Te lo explico sin tecnicismos

NPM (Node Package Manager) es como el App Store pero para código JavaScript. Es donde los desarrolladores suben sus soluciones para que otros las puedan usar. Simple, ¿verdad?

Las tres caras de NPM

NPM funciona como:

  1. Un repositorio de código: La mayor colección de paquetes de software de código abierto del mundo.
  2. Una herramienta de línea de comandos: Que te permite interactuar con dicho repositorio.
  3. Un registro online: Donde puedes buscar, publicar y gestionar paquetes en npmjs.com.

¿Por qué NPM cambió mi vida como desarrollador?

Instalando NPM (spoiler: ya lo tienes)

Aquí viene una buena noticia: si tienes Node.js instalado, ya tienes npm. Es como cuando compras un celular y viene con el cargador incluido.

Si no tienes Node.js, aquí te digo cómo:

  1. Ve a nodejs.org
  2. Descarga la versión LTS (Long-Term Support) recomendada para la mayoría de usuarios
  3. Sigue el asistente de instalación
  4. Verifica la instalación con:
node -v
npm -v

Estos comandos mostrarán las versiones instaladas de Node.js y npm respectivamente.

NPM Install: tu nuevo mejor amigo

npm install es el comando que vas a usar todos los días. Es como ir al supermercado, pero en lugar de comida, compras funcionalidades para tu proyecto.

Instalar un paquete específico

npm install nombre-del-paquete

Por ejemplo, para instalar React:

npm install react

Instalar múltiples paquetes

npm install paquete1 paquete2 paquete3

Instalar dependencias de desarrollo

Estas son cosas que solo necesitas mientras desarrollas, no cuando tu app está en producción:

npm install nombre-del-paquete --save-dev

O usando la forma abreviada:

npm install nombre-del-paquete -D

Instalar todas las dependencias de un proyecto

¿Acabas de clonar un repo? Este comando es tu salvavidas:

npm install

NPM Run Dev: poniendo tu proyecto en marcha

npm run dev es como el botón de "encender" de tu proyecto. Lo verás en casi todos los frameworks modernos.

npm run dev

Ojo, este comando no es mágico. Simplemente ejecuta un script que está definido en tu archivo package.json:

"scripts": {
  "dev": "vite", // Ejemplo con Vite
  "start": "react-scripts start", // Ejemplo con Create React App
  "dev": "next dev" // Ejemplo con Next.js
}

¿Qué hace NPM Run Dev?

En mi experiencia, es el comando que más uso después de npm install.

NPM CI: el profesional de la familia

npm ci es como el hermano mayor y más responsable de npm install. Lo uso siempre en producción y te explico por qué:

npm ci

Diferencias entre NPM CI y NPM Install:

  1. Más estricto: Requiere un archivo package-lock.json.
  2. Más rápido: Al no tener que resolver las dependencias, es más rápido que npm install.
  3. Más predecible: Siempre instala exactamente lo que está en el lock file.
  4. Borra node_modules: Elimina la carpeta node_modules antes de instalar.
  5. No modifica package.json ni package-lock.json: A diferencia de npm install que puede actualizarlos.

Cuándo usar NPM CI:

Lo importante es que npm ci te garantiza que todo el equipo tendrá exactamente las mismas versiones.

NPM Link: para cuando desarrollas tus propios paquetes

Si alguna vez has desarrollado un paquete npm, npm link es un salvavidas. Te permite probar tu paquete sin tener que publicarlo cada vez que haces un cambio.

npm link

Uso práctico de NPM Link:

  1. En tu paquete:

    cd ruta/a/tu-paquete
    npm link
    
  2. En tu proyecto que usa ese paquete:

    cd ruta/a/tu-proyecto
    npm link nombre-de-tu-paquete
    

Esto permite probar cambios en tiempo real sin tener que publicar nuevas versiones.

Limpiando la casa con NPM Clean Cache

A veces npm se porta raro. Cuando eso pasa, limpiar la caché suele arreglar el problema:

npm cache clean --force

¿Cuándo deberías limpiar la caché de NPM?

Es como reiniciar tu computadora cuando se pone lenta.

NPM Delete: eliminando lo que no necesitas

Para eliminar un paquete, usas npm uninstall (no existe un comando npm delete):

npm uninstall nombre-del-paquete

Desinstalar dependencias de desarrollo:

npm uninstall nombre-del-paquete --save-dev

Eliminar un paquete globalmente:

npm uninstall -g nombre-del-paquete

El archivo package.json: el corazón de tu proyecto

Este archivo es básicamente la partida de nacimiento de tu proyecto. Contiene toda la información importante sobre qué necesita para funcionar.

Elementos clave del package.json:

{
  "name": "mi-proyecto",
  "version": "1.0.0",
  "description": "Descripción de mi proyecto",
  "main": "index.js",
  "scripts": {
    "dev": "vite",
    "build": "vite build",
    "test": "vitest"
  },
  "dependencies": {
    "react": "^18.2.0",
    "react-dom": "^18.2.0"
  },
  "devDependencies": {
    "vite": "^4.4.0",
    "vitest": "^0.34.1"
  }
}

Iniciar un nuevo package.json:

npm init

O para aceptar todas las opciones por defecto:

npm init -y

Mis mejores consejos para usar NPM

Después de años usando npm, estos son los consejos que me hubiera gustado conocer desde el principio:

  1. Usa package-lock.json: Asegúrate de que este archivo se envíe al control de versiones.
  2. Especifica versiones exactas: Para dependencias críticas, considera usar versiones exactas.
  3. Scripts personalizados: Aprovecha la sección "scripts" para automatizar tareas comunes.
  4. Utiliza .npmrc: Para configuraciones personalizadas de npm.
  5. Considera npm ci: Para entornos de producción o CI.

Cuando NPM te da problemas

"Cannot find module"

npm install

Errores de permisos

sudo npm install -g nombre-del-paquete  # En Linux/Mac

O mejor, configura npm para que no requiera sudo:

mkdir ~/.npm-global
npm config set prefix '~/.npm-global'

Problemas de versiones:

Si tienes conflictos de versiones, puedes probar:

npm update

O para un paquete específico:

npm update nombre-del-paquete

Alternativas a NPM que deberías conocer

Aunque npm es el rey, hay otras opciones interesantes:

  1. Yarn: Desarrollado por Facebook, con énfasis en seguridad y determinismo.
  2. pnpm: Más eficiente en el uso del espacio en disco.
  3. Bun: Un nuevo runtime y gestor de paquetes que promete ser más rápido.

Mi reflexión final

NPM cambió completamente mi forma de programar. Ya no pienso en términos de "¿cómo voy a hacer esto?" sino "¿quién ya lo habrá hecho?". Es la diferencia entre ser un desarrollador luchando solo contra el mundo y ser parte de una comunidad global que comparte soluciones.

¿Cuál es tu comando de npm favorito? ¿Hay algún truco que uses que me haya faltado? Me encantaría escuchar tu experiencia en los comentarios.

Comentarios

Posts relacionados