Resumen

Mantener las dependencias de un proyecto al día es una tarea crítica que muchos equipos postergan, pero que puede marcar la diferencia entre una aplicación segura y una con vulnerabilidades expuestas. Cuando retomas un proyecto existente, lo primero que debes hacer es verificar qué paquetes necesitan actualizarse y aplicar los cambios necesarios antes de escribir una sola línea de código nueva.

¿Por qué es fundamental actualizar las dependencias de tu proyecto?

Cuando trabajas con un proyecto previamente construido, es común encontrar alertas de seguridad relacionadas con vulnerabilidades en dependencias. Estas alertas aparecen porque los paquetes que utilizas pueden tener fallos descubiertos después de su publicación. Si no actúas a tiempo, tu servidor y tu cliente quedan expuestos a riesgos que pueden afectar tanto el rendimiento como la integridad de la aplicación.

El concepto de breaking change es especialmente relevante aquí. Un breaking change ocurre cuando una dependencia pasa de una versión mayor a otra (por ejemplo, de la versión 17 a la 18, o de la 4 a la 5) e introduce cambios que no son compatibles hacia atrás. Esto significa que no basta con ejecutar un comando para actualizar: se requiere una migración más completa del código que utiliza esa dependencia.

¿Cómo verificar y actualizar dependencias con npm?

El flujo de trabajo comienza creando una rama nueva para aislar los cambios. En este caso se utiliza el shortcut gco (equivalente a git checkout) con la bandera -b para crear la rama [0:55]:

bash git checkout -b feature/server-side-render-2020

Una vez en la rama, el comando clave para diagnosticar el estado de tus paquetes es npm outdated [1:20]. Este comando muestra un listado con tres columnas importantes:

  • Current: la versión instalada actualmente.
  • Wanted: la versión mínima requerida para evitar problemas de seguridad, respetando el rango definido en tu package.json.
  • Latest: la última versión disponible del paquete.

Es común que wanted y latest coincidan, pero hay casos donde no es necesario saltar a la última versión, especialmente cuando implica un breaking change.

¿Qué hace exactamente npm update?

Para aplicar las actualizaciones compatibles, se ejecuta [1:52]:

bash npm update

Este comando actualiza las dependencias dentro del rango de versiones permitido por el package.json. En el ejemplo del proyecto Platzi Video, el resultado fue significativo: se añadieron 132 paquetes, se removieron 44 y se actualizaron 261 [2:15]. Aunque el package.json no lista tantas dependencias directamente, cada paquete puede tener sus propias subdependencias, lo que genera este efecto cascada.

¿Cómo verificar que la actualización fue exitosa?

Después de ejecutar npm update, hay dos pasos de verificación importantes:

  • Ejecutar git status para confirmar que se modificaron package.json y package-lock.json [2:40].
  • Ejecutar git diff para revisar exactamente qué dependencias cambiaron (por ejemplo, actualizaciones de Babel).
  • Volver a ejecutar npm outdated para comparar el estado actual con el anterior [2:55].

Al correr npm outdated por segunda vez, notarás una reducción considerable en la lista de paquetes pendientes. Los que permanezcan serán aquellos que requieren un salto de versión mayor y, por lo tanto, una migración manual.

¿Cómo confirmar que la aplicación funciona tras la actualización?

El paso final es ejecutar la aplicación para asegurarte de que todo sigue funcionando correctamente. En el package.json se encuentra el script start, que utiliza webpack-dev-server en modo de desarrollo [3:30]:

bash npm run start

Al ejecutarlo, la aplicación se levanta en localhost:8080 y se puede verificar visualmente que todo se renderiza con normalidad. Este paso es esencial porque una actualización de dependencias, aunque sea menor, puede introducir comportamientos inesperados.

Recuerda que las actualizaciones de seguridad no son opcionales. Cada paquete desactualizado es una puerta potencial para vulnerabilidades que pueden comprometer tu servidor y la experiencia de tus usuarios. ¿Has tenido algún problema actualizando dependencias en tus proyectos? Comparte tu experiencia en los comentarios.

      Actualizando dependencias en NPM