Muestra las diferencias entre dos versiones de la página.
| Ambos lados, revisión anterior Revisión previa Próxima revisión | Revisión previa | ||
|
ada:howto:sicoferp:factory:new-migracion-sicoferp:front:libs [2024/07/31 21:38] 192.168.175.41 |
ada:howto:sicoferp:factory:new-migracion-sicoferp:front:libs [2024/08/06 14:23] (actual) 192.168.175.41 |
||
|---|---|---|---|
| Línea 1: | Línea 1: | ||
| - | Paso 1: Crear la Librería en Angular | + | 1: Crear la Librería en Angular |
| Instalar Angular CLI si no lo tienes: | Instalar Angular CLI si no lo tienes: | ||
| Línea 16: | Línea 16: | ||
| </code> | </code> | ||
| - | Agregar Código a la Librería: | + | Agregar código a la Librería: |
| Modifica los archivos en projects/my-library/src/public-api.ts para exportar tu funcionalidad. Por ejemplo, puedes agregar un servicio: | Modifica los archivos en projects/my-library/src/public-api.ts para exportar tu funcionalidad. Por ejemplo, puedes agregar un servicio: | ||
| Línea 38: | Línea 38: | ||
| export * from './lib/my-library.service'; | export * from './lib/my-library.service'; | ||
| + | Nota: Librería ejemplo | ||
| - | Construir la Librería: | ||
| </code> | </code> | ||
| + | |||
| + | Para construir la Librería: | ||
| + | <code> | ||
| ng build my-library | ng build my-library | ||
| </code> | </code> | ||
| - | |||
| Línea 53: | Línea 55: | ||
| - Guarda los cambios. | - Guarda los cambios. | ||
| - | 3. Para publicar librería es necesario configurar Nexus local con credenciales, entonces en una consola dentro del proyecto. | + | 3. Preparar Librería para Publicar en Nexus |
| + | |||
| + | Para publicar librería es necesario configurar Nexus local con credenciales, entonces en una consola dentro del proyecto. | ||
| <code> | <code> | ||
| + | |||
| npm login --registry=http://10.1.40.130:8081/repository/npm-hosted/ | npm login --registry=http://10.1.40.130:8081/repository/npm-hosted/ | ||
| Línea 67: | Línea 72: | ||
| </code> | </code> | ||
| - | + | Asegurate de agregar al archivo .npmrc de la librería la ruta y las credenciales. | |
| - | Paso 2: Publicar la Librería en GitLab | + | |
| - | Configurar el Registro de GitLab en .npmrc: | + | |
| - | + | ||
| - | Crea o modifica el archivo .npmrc en tu directorio de usuario (C:\Users\<tu_usuario>\.npmrc en Windows o ~/.npmrc en Linux/Mac): | + | |
| <code> | <code> | ||
| @mflibs:registry=http://10.1.40.130:8081/repository/npm-hosted/ | @mflibs:registry=http://10.1.40.130:8081/repository/npm-hosted/ | ||
| //10.1.40.130:8081/repository/npm-hosted/:_authToken=NpmToken.963f3fcd-2bb5-3570-aa39-acb05c1fe44f | //10.1.40.130:8081/repository/npm-hosted/:_authToken=NpmToken.963f3fcd-2bb5-3570-aa39-acb05c1fe44f | ||
| + | </code> | ||
| + | |||
| + | |||
| + | Aegurate de agregar el publishConfig en el package.json | ||
| + | |||
| <code> | <code> | ||
| + | "publishConfig": { | ||
| + | "@mflibs:registry": "http://10.1.40.130:8081/repository/npm-hosted/" | ||
| + | } | ||
| + | </code> | ||
| + | |||
| - | 2. **Publicar la Librería**: | + | 4. Publicar la Librería: |
| Primero, asegúrate de estar en el directorio del workspace (donde está el archivo `package.json` principal) y luego publica la librería: | Primero, asegúrate de estar en el directorio del workspace (donde está el archivo `package.json` principal) y luego publica la librería: | ||
| Línea 85: | Línea 96: | ||
| <code> | <code> | ||
| cd dist/my-library | cd dist/my-library | ||
| - | npm install @mflibs/encryption-lib@1.0.15 --registry=http://10.1.40.130:8081/repository/npm-hosted/ | + | |
| + | npm publish ó npm publish --registry=http://10.1.40.130:8081/repository/npm-hosted/ | ||
| </code> | </code> | ||
| - | Paso 3: Instalar la Librería usando npm link | + | {{:ada:howto:sicoferp:factory:new-migracion-sicoferp:front:exito_publicanco.png?600|}} |
| + | |||
| + | Paso 5: Instalar la Librería usando npm link (Para probar local) | ||
| Crear un enlace simbólico global: | Crear un enlace simbólico global: | ||
| <code> | <code> | ||
| - | Copy code | ||
| cd dist/my-library | cd dist/my-library | ||
| npm link | npm link | ||
| Línea 107: | Línea 120: | ||
| - | Paso 4: Importar la Librería desde Nexus | + | 6: Importar la Librería desde Nexus; |
| - | Instalar la Librería desde el Registro de Nexus: | + | |
| - | En el directorio de tu proyecto Angular, ejecuta: | + | En el directorio de tu proyecto principal de angular Angular, debe crear .npmrc y agregar las credenciales; |
| <code> | <code> | ||
| - | npm install @mflibs/my-library --registry http://10.1.140.120/api/v4/projects/133/packages/npm/ | + | @mflibs:registry=http://10.1.40.130:8081/repository/npm-hosted/ |
| + | //10.1.40.130:8081/repository/npm-hosted/:_authToken=NpmToken.963f3fcd-2bb5-3570-aa39-acb05c1fe44f | ||
| </code> | </code> | ||
| - | Paso 5: Descargar la Librería usando curl | ||
| + | En el directorio de tu proyecto principal de Angular, ejecutar en la consola; | ||
| + | <code> | ||
| + | npm install @mflibs/encryption-lib@1.0.15 --registry=http://10.1.40.130:8081/repository/npm-hosted/ | ||
| + | </code> | ||
| + | |||
| + | **Nota**: Con la librería ya agregada al package.json y el archivo .npmrc con las credenciales, no es necesario volver a instalar en el proyecto, solo es para la primera construcción. | ||
| + | |||
| + | **El orden adecuado para realizar cambios y publicar sería el siguiente; ** | ||
| + | |||
| + | - Realizar cambios | ||
| + | - git add . | ||
| + | - git commit -m 'fix: comentario' | ||
| + | - git push (Aquí se aumenta la versión con la tarea del Hook, si no lo tiene configurado debe aumentar manual en package.json y utilizar git push --no-verify) | ||
| + | - npm install | ||
| + | - npm run build | ||
| + | - cd dist/my-library | ||
| + | - npm publish | ||
| Línea 128: | Línea 157: | ||
| Si sigues estos pasos, deberías poder crear, publicar, y consumir tu librería Angular de manera efectiva utilizando tanto npm link como el registro privado de Nexus. | Si sigues estos pasos, deberías poder crear, publicar, y consumir tu librería Angular de manera efectiva utilizando tanto npm link como el registro privado de Nexus. | ||
| + | |||
| + | |||
| + | [[ada:howto:sicoferp:factory:new-migracion-sicoferp:front|←Regresar]] | ||
| + | |||