Cómo integrar librerías y plugins a Angular

En programación, una librería es un archivo o conjunto de archivos que se utilizan para facilitar la programación.

Un plugin es un componente de código que se usa para ampliar su funcionalidad.

Instalación e integración de la librería:

Para poder instalar una librería en angular tenemos que entrar en la página web oficial de npm que cómo ya sabemos es el gestor de paquetes de Angular y buscar la librería que queramos descargar.

En mi caso, para este ejemplo descargaré Jquery para Angular. Cómo podemos ver al buscarlo nos aparece el código que tendremos que poner en el terminal para instalarlo.

npm i jquery

Si queremos que se nos instale solamente en el proyecto donde lo queramos usar escribimos el siguiente código:

npm i --save jquery

Para comprobar que se nos ha instalado correctamente en nuestro proyecto tenemos que entrar en nuestro archivo package.json y en lugar donde se crean las dependencias es donde debe estar escrito la librería con su versión.
Ahora solo hace falta que Angular nos lo reconozca, para eso entramos en el archivo angular.json y en el apartado de scripts escribimos:

"node_modules/jquery/dist/jquery.min.js"

Esta es la ruta donde se ha guardado la librería al instalarla.

Instalación e integración de un plugin:

En el caso que nos queramos descargar un plugin que contenga css hemos de seguir los mismos pasos qué en el ejemplo anterior solo que además tendremos que añadir en el fichero angular.json la ubicación de los ficheros css en el apartado styles.

Es recomendado usar la versión manual en esta descarga, aquí dejo la página web oficial.

En mi caso estoy usando un plugin llamado bxslider para crear un slider con JavaScript:

"src/assets/bxslider-4-4.2.12/dist/jquery.bxslider.min.css"

 

Esperamos que les haya sido de utilidad.

Artículos recientes

Artículos relacionados