Trabajando con Monorepos en Frontend

Mar 28 2023
(Monorepo + Lerna + Nx + Espacio de trabajo de hilo)
¿Qué es un Monorepo? Un monorepo es un repositorio único que contiene múltiples proyectos distintos, con relaciones bien definidas. Es un concepto arquitectónico en el que mantiene todos los fragmentos de código aislados en un superrepositorio en lugar de administrar múltiples repositorios más pequeños Conceptos erróneos generales sobre Monorepos Monorepos son diferentes de Monoliths en muchos aspectos.

¿Qué es un Monorepo?

Un monorepo es un repositorio único que contiene múltiples proyectos distintos, con relaciones bien definidas. Es un concepto arquitectónico en el que mantiene todos sus fragmentos de código aislados en un súper repositorio en lugar de administrar varios repositorios más pequeños.

Conceptos erróneos generales sobre Monorepos

Los Monorepos son diferentes de los Monolitos en muchos aspectos. Así es las desventajas de los monolitos no son aplicables a los Monorepos.

Estos son los conceptos erróneos generales sobre Monorepos:

  • Los lanzamientos irán juntos para todos los proyectos.
  • Permite que otros equipos cambien mi código sin que yo lo sepa.
  • Da como resultado la creación de una base de código compleja y difícil de depurar.
  • Es un gran repositorio de código, por lo que el mantenimiento será difícil y aumentará la complejidad.

Bazel, Gradle, lage, Lerna, Nx, Rush. He usado Lerna para mi proyecto, así que cubriré eso.

¿Cómo configuramos/administramos un Monorepo?

Gestión de los Monorepos con Lerna -

Lerna es la herramienta monorepo para proyectos frontend.

Resuelve tres de los mayores problemas de los monorepos de JavaScript:

  1. Almacenamiento en caché de computación local: la capacidad de almacenar y reproducir archivos y procesar la salida de las tareas. En la misma máquina, nunca construirá o probará lo mismo dos veces.

3. Análisis del espacio de trabajo: la capacidad de comprender el gráfico del proyecto del espacio de trabajo sin configuración adicional.

4. Visualización de gráficos de dependencia: visualice las relaciones de dependencia entre proyectos y/o tareas. La visualización es interactiva, lo que significa que puede buscar, filtrar, ocultar, enfocar/resaltar y consultar los nodos en el gráfico.

Desventajas de Monorepo:

  1. No podemos compartir la parte específica del proyecto, por lo que se debe dar acceso al repositorio completo, lo que puede generar problemas de seguridad.

Uso de Yarn Workspaces con lerna

Lerna y Yarn Workspaces nos brindan la capacidad de crear bibliotecas y aplicaciones en un solo repositorio sin obligarnos a publicar en npm u otros registros. Podemos pasar por ciclos de código, prueba y depuración mucho más rápido al compartir componentes localmente.

Lerna & Yarn Workspaces esperan una carpeta llamada packagesen su repositorio. Un paquete es simplemente un "mini-repositorio" que se puede versionar, construir y publicar de forma independiente. Las versiones de los paquetes pueden ser iguales o diferentes también.

Podemos tener cualquier cantidad de paquetes dentro de un monorepo, con dependencias complejas entre sí. El ingrediente secreto detrás de la gestión de estas dependencias es el concepto de enlaces simbólicos .

¿Qué es un enlace simbólico?

En informática, un enlace simbólico (abreviatura de Enlace simbólico) es un archivo que hace referencia a otro archivo o directorio y hace que parezca que el archivo o directorio al que se hace referencia está en la ubicación del archivo original.

La clave para lerna y el espacio de trabajo es la configuración del archivo lerna.json. una vez que esté configurado, podemos ejecutar los siguientes comandos

  1. yarn — instala las dependencias
  2. compilación de hilo: esto ejecutará el siguiente comando definido en el archivo package.json
  3. lerna exec - babel src -d dist - ignore test.js
    

    {
      "lerna": "1.0.0",
      "packages": [
        "packages/*"
      ],
      "version": "independent",
      "npmClient": "yarn",
      "useWorkspaces": true
    }
    

¡Tada! por lo que nuestra aplicación web Monorepo está lista.

Gracias por leer !

Referencias -