Librerías compartidas en Nx: Angular y TypeScript para múltiples apps
Contenido del curso
Gildder Guerrero Ramirez
Cristian Acalo
En el contexto del curso, se mencionan dos tipos de librerías en NX:
UI Share: Esta es una librería de componentes compartidos específica para Angular, donde se pueden almacenar servicios y componentes reutilizables entre diferentes aplicaciones.
Utils Common: Esta librería está basada en TypeScript y se utiliza para compartir funciones, modelos y servicios que pueden ser utilizados no solo en aplicaciones Angular, sino también en otros proyectos en TypeScript.
Ambas librerías permiten un desarrollo más colaborativo y eficiente al centralizar el código compartido.
🦄✨Componentes compartidos
Angular
El comando a usar para añadir un paquete de componentes compartidos es similar al de aplicaciones. Cambia en su tipo:
npx nx g @nx/angular:library apps/ui-shared --standalone
Como se observa, ya no es tipo application, en su lugar se establece un tipo library
Typescript
En ocasiones puede surgir la necesidad de crear componentes compartidos que sea compatible con cualquier tipo de proyecto que use typescript, no solo Angular. Es cuando se puede realizar la creación de un componente compartido JavaScript, basado en TypeScript, lo cual se puede lograr con el siguiente comando:
px nx g @nx/js:lib apps/utils-common --bundler=tsc --linter=eslint --unitTestRunner=jest
Conexión entre aplicaciones
Que sería de un monorepo si las aplicaciones no estuvieran conectadas, ¿verdad?
NX, proporciona la facilidad de visualizar las conexiones que realicemos a través de nuestras aplicaciones. Con el siguiente comando:
npx nx graph
Se desplegará una aplicación que nos mostrará los proyectos actuales de nuestro monorepo
Si realizamos conexiones, este cambiará, ejemplo:
Mostrando así, que existen conexión de app1 y app2 con ui-shared.
