Herramientas de usuario

Herramientas del sitio


ada:howto:sicoferp:factory:new-migracion-sicoferp:front:libs

Diferencias

Muestra las diferencias entre dos versiones de la página.

Enlace a la vista de comparación

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/29 19:30]
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';​
  
-</​code>​+Nota: Librería ejemplo
  
-Construir la Librería:+</​code>​
  
 +Para construir la Librería:
 <​code>​ <​code>​
 ng build my-library ng build my-library
 </​code>​ </​code>​
  
-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):+2Configurar Nexus. 
 + 
 +  - Ve a la pestaña de "​Repository" ​en la configuración. 
 +  - Haz clic en "​Create repository"​ y selecciona "npm (hosted)". 
 +  - Configura el repositorio con un nombre, como npm-hosted, y ajusta las demás configuraciones según tus necesidades. 
 +  - Guarda los cambios. 
 + 
 +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>​
-@mflibs:registry=http://​10.1.140.120/api/v4/projects/​133/​packages/npm/ + 
-//10.1.140.120/api/v4/​projects/​133/​packages/​npm/:​_authToken=<your-token+npm login --registry=http://​10.1.40.130:8081/repository/npm-hosted/ 
 + 
 +Ingresa usuario y contraseña de Nexus 
 + 
 + 
 +En el archivo C:​\Users\{usuario}\.npmrc ​ se genera la credencial como el siguiente ejemplo; 
 + 
 +//10.1.40.130:8081/repository/npm-hosted/:​_authToken=NpmToken.963f3fcd-2bb5-3570-aa39-acb05c1fe44f 
 + 
 +</​code>​ 
 + 
 +Asegurate de agregar al archivo .npmrc de la librería la ruta y las credenciales.  
 <​code>​ <​code>​
 +@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>​
  
  
-2**Publicar la Librería**:+Aegurate de agregar el publishConfig en el package.json 
 + 
 +<​code>​ 
 +  "​publishConfig":​ { 
 +  "​@mflibs:​registry":​ "​http://​10.1.40.130:​8081/​repository/​npm-hosted/"​ 
 +  }     
 +</​code>​ 
 + 
 + 
 + 
 +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 63: Línea 96:
 <​code>​ <​code>​
 cd dist/​my-library cd dist/​my-library
-npm publish --registry http://​10.1.140.120/api/v4/​projects/​133/​packages/npm/+ 
 +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>​
-sh 
-Copy code 
 cd dist/​my-library cd dist/​my-library
 npm link npm link
Línea 86: Línea 120:
  
  
-Paso 4: Importar la Librería desde GitLab +6: Importar la Librería desde Nexus;
-Instalar la Librería desde el Registro de GitLab:+
  
-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 
-Descargar el Archivo del Paquete: 
  
-Usa curl para descargar ​el archivo .tgz:+En el directorio de tu proyecto principal de Angular, ejecutar en la consola;
  
 <​code>​ <​code>​
-$ mkdir -./mflibs && curl -H "​Authorization:​ Bearer jwPyfnRVxbD2ihgVPByN" ​http://​10.1.140.120/api/​v4/​projects/​133/​packages/npm/​@mflibs/​encryption-lib/-/​@mflibs/​my-library.tgz -o ./​mflibs/​encryption-lib.tgz+npm install @mflibs/​encryption-lib@1.0.15 --registry=http://​10.1.40.130:8081/repository/npm-hosted/
 </​code>​ </​code>​
  
-<​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. ​ 
-npm install ​./@mflibs/my-library.tgz + 
-</​code>​+**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 
 + 
  
 **Consideraciones Finales** **Consideraciones Finales**
  
-Asegúrate de tener correctamente configurado tu archivo .npmrc y de utilizar el token de acceso adecuado para autenticarte en el registro de GitLab. Además, asegúrate de que la URL del registro sea accesible desde tu red.+Asegúrate de tener correctamente configurado tu archivo .npmrc y de utilizar el token de acceso adecuado para autenticarte en el registro de Nexus. Además, asegúrate de que la URL del registro sea accesible desde tu red. 
 + 
 +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]]
  
-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 GitLab. 
ada/howto/sicoferp/factory/new-migracion-sicoferp/front/libs.1722281451.txt.gz · Última modificación: 2024/07/29 19:30 por 192.168.175.41