Al trabajar en proyectos distribuidos en varios paquetes y distintos repositorios, a menudo podemos estar desarrollando al mismo tiempo la aplicación principal y los paquetes que esta consume. Probar los cambios de la librería en la aplicación antes de publicar una nueva versión puede volverse un poco tedioso. Las opciones clásicas como npm link o yarn link funcionan, pero a veces traen consigo sus propios problemas: enlaces simbólicos que se rompen, problemas con dependencias duplicadas o la necesidad de permisos especiales.

Yalc es una herramienta sencilla que nos facilita enormemente este proceso de desarrollo local. Yalc funciona como una especie de repositorio local, muy ligero, para nuestros paquetes. En lugar de usar enlaces simbólicos globales complejos, Yalc publica los paquetes en un almacén local centralizado y luego los “añade” o “enlaza” a nuestros proyectos de una manera más controlada y predecible, muy similar a como lo harían npm o yarn con un paquete real publicado.

Instalar Yalc es sencillo, lo hacemos de forma global a través de npm o yarn:

npm install -g yalc

o si prefieres yarn

yarn global add yalc

Una vez instalado, ya podemos empezar a usarlo. Imaginemos un escenario bastante común: estamos creando una pequeña librería de utilidades que llamaremos @libreria/utils y queremos usarla en nuestro proyecto principal mi-proyecto.

Nuestra estructura de directorios podría ser algo así:

~/desarrollo/
├── mi-libreria-utils/
│   ├── index.js
│   └── package.json
└── mi-proyecto/
    ├── src/
    │   └── index.js
    └── package.json

Dentro de mi-libreria-utils, nuestro package.json sería simple, definiendo el nombre del paquete:

{
  "name": "@libreria/utils",
  "version": "1.0.0",
  "main": "index.js"
  // ... otras configuraciones
}

Y el index.js podría contener una función de ejemplo:

export function saludar(nombre) {
  console.log(`¡Hola, ${nombre}! Bienvenido/a desde @libreria/utils.`);
}

Ahora, en lugar de hacer npm link, nos situamos en el directorio de nuestra librería (~/desarrollo/mi-libreria-utils) y ejecutamos:

cd ~/desarrollo/mi-libreria-utils
yalc publish

Este comando compila (si es necesario, según tu configuración) y copia los archivos del paquete a un almacén local gestionado por Yalc (normalmente ubicado en ~/.yalc). Verás un mensaje indicando que @libreria/[email protected] ha sido publicado en el almacén indicando que el paquete ya está “publicado” localmente.

A continuación, nos movemos al directorio del proyecto que consumirá la librería (~/desarrollo/mi-proyecto) y añadimos la dependencia usando Yalc:

cd ~/desarrollo/mi-proyecto
yalc add @libreria/utils

Yalc ha hecho varias cosas:

1. Ha copiado los archivos de @libreria/utils desde su almacén local (~/.yalc) a una carpeta .yalc dentro de nuestro mi-proyecto.
2. Ha creado (o actualizado) un archivo yalc.lock en la raíz de mi-proyecto. Este archivo rastrea las dependencias gestionadas por Yalc, similar a como package-lock.json o yarn.lock rastrean las dependencias de npm/yarn.
3. Ha modificado nuestro package.json para apuntar a la versión local en la carpeta .yalc, añadiendo una dependencia tipo file::

   // ~/desarrollo/mi-proyecto/package.json (extracto)
   {
     "name": "mi-proyecto",
     "version": "1.0.0",
     "dependencies": {
       "@libreria/utils": "file:.yalc/@libreria/utils"
       // ... otras dependencias
     }
     // ...
   }

4. Finalmente, ejecuta yarn install o npm install (según detecte) para que el gestor de paquetes instale la dependencia desde la ruta local especificada.

La estructura de mi-proyecto ahora se vería así:

~/desarrollo/mi-proyecto/
├── .yalc/
│   └── @libreria/
│       └── utils/  # Contenido copiado de mi-libreria-utils
├── node_modules/
│   └── @libreria/
│       └── utils -> ../../.yalc/@libreria/utils # Enlace simbólico creado por npm/yarn
├── src/
│   └── index.js
├── package.json
└── yalc.lock # Archivo de seguimiento de Yalc

Ahora, en mi-proyecto/src/index.js, podemos importar y usar nuestra librería local como si fuera una dependencia normal:

import { saludar } from '@libreria/utils';

saludar('Mundo'); // Imprimirá: ¡Hola, Mundo! Bienvenido/a desde @libreria/utils.

El flujo de trabajo se vuelve muy ágil. Si hacemos cambios en mi-libreria-utils, simplemente volvemos a ejecutar yalc publish en su directorio. Para que estos cambios se reflejen en mi-proyecto, tenemos dos opciones:

1. Push automático: Ejecutar yalc publish --push en la librería. Esto no solo publica la nueva versión en el almacén local de Yalc, sino que también actualiza automáticamente todos los proyectos (mi-proyecto en este caso) que tengan añadida esa librería vía Yalc. Es muy práctico.
2. Actualización manual: Ejecutar yalc publish (sin --push) en la librería y luego, en mi-proyecto, ejecutar yalc update @libreria/utils o simplemente yalc update --all para actualizar todas las dependencias de Yalc.

Yalc también ofrece otros comandos útiles como:

• yalc link @libreria/utils: Similar a yalc add, pero en lugar de modificar package.json, crea un enlace simbólico directo en node_modules hacia la versión en el almacén de Yalc. Puede ser útil en algunos casos, aunque yalc add suele ser más robusto.
• yalc remove @libreria/utils: Elimina la dependencia del proyecto y limpia las referencias en package.json y yalc.lock.
• yalc installations show: Muestra qué paquetes de Yalc están instalados en el proyecto actual.

Conclusión

En resumen, Yalc nos ofrece una forma muy cómoda y fiable de trabajar con paquetes locales. Nos permite simular el proceso de publicación e instalación de una manera más aislada y controlada que npm link, facilitando las pruebas y el desarrollo iterativo entre librerías y aplicaciones consumidoras. Si desarrollamos paquetes npm o trabajamos en monorepos donde necesitamos probar módulos de forma independiente, darle una oportunidad a Yalc puede ahorrarnos bastante tiempo.