Cómo instalar Bower

Sin Bower, cuando queremos instalar una librería Javascript como jQuery o un framework de diseño como Bootstrap, simplemente íbamos al sitio de esos paquetes que requeríamos para un trabajo, los descargábamos y los colocábamos a mano en una carpeta de nuestro proyecto, o bien configurábamos una ruta absoluta al CDN en las etiquetas SCRIPT o LINK, necesarias para incluir esos paquetes. Con Bower ese trabajo, que no es pesado pero sí requiere de varios pasos (ir a un sitio web, descargar una librería, colocarla en una carpeta), se puede hacer con un sencillo comando de consola:

Quizás todavía no le veas mucha utilidad todavía pero piensa en el momento en el que tienes que mantener toda una serie de librerías externas y actualizarlas con sus nuevas versiones. Requiere volver a descargar la librería a actualizar, borrar la antigua, subir la nueva, etc. Puede que hacer esto para una sola librería no represente mucho trabajo, pero a veces tenemos docenas de paquetes de terceros en un proyecto y entonces mantenerlos actualizados sí te puede llevar un rato. ¿No sería mejor hacerlo con un simple comando de consola? Obviamente, sí.

Para usar Bower primero tenemos que instalarlo. Es un programa realizado con NodeJS, por lo que si no tienes Node el primer paso será instalarlo.

Cómo instalar Node

Ahora comprobamos con el siguiente comando que versión se ha instalado y ya de paso verificamos que se ha instalado.

Al instalar NodeJS se instala también un gestor de paquetes Javascript llamado “npm”. Este gestor sirve para descargar e instalar en nuestro sistema cualquier programa basado en NodeJS y se opera por línea de comandos. La manera de instalar Bower en nuestro ordenador es ejecutando el correspondiente comando de instalación, vía npm, como sigue:

Ese comando descargará e instalará Bower y estaremos listos para usarlo. Usar Bower no tiene mucho secreto. Si conoces ya algún otro gestor de paquetes, como el propio npm, Composer para PHP, etc., seguramente ya tendrás una idea en la cabeza. Si no es así no desesperes porque te explicamos todo a continuación. De entre todas las maneras de usar Bower te vamos a contar la más “formal”.

NOTA: SI AL EJECUTAR EL COMANDO INSTALL DA ERROR DE PERMISOS, PARA EVITARLO HAREMOS LO SIGUIENTE:

Para poder evitar este molesto error basta con hacer la instalación, por ejemplo de jquery, de la siguiente forma.

sudo bower install –allow-root –save  jquery

LISTADO DE COMANDOS BÁSICOS

sudo bower init –allow-root

Es un atajo para generar un archivo bower.json, en el que definir las propiedades de un proyecto

sudo bower install –allow-root

Si hacemos “bower install”, sin ningún parámetro adicional, bower leerá lo que hayamos configurado en el archivo bower.json, instalando todas las dependencias que hayamos definido. Todos los componentes se colocarán en una carpeta específica llamada generalmente “bower_components”.

sudo bower install –allow-root –save bootstrap fontawesome jquery

Para instalar varias dependencias y añadirlas al archivo bower.json
En concreto este comando instalaría las dependencias bootstrap fontawesome y jquery dentro del directorio bower_components

sudo bower uninstall –allow-root –save angular
Para desinstalar un paquete, en concreto este ejemplo desinstalaría el paquete angular

Fuentes para Ampliar Información

https://desarrolloweb.com/articulos/uso-bower-gestor-dependencias.html

https://openwebinars.net/blog/gestionando-dependencias-en-front-end-con-bower/

Bower, un gestor de paquetes para AngularJS