Angular 6 – Añadir Bootstrap 4 con JQuery

Recordar lo primero que para utilizar toda la potencia de BootStrap, necesitamos tener instaladas las librerias de JQuery y Popper 

Hay varias maneras de  instalar estas librerías.

  1. Localmente usando npm

Una vez estemos situados el directorio principal del proyecto, desde tu terminal preferido ejecutar las instrucciones siguientes:

Esto nos instalara los archivos necesarios bajo el directorio **node-modules. **

Ahora debemos incluir el fichero de estilos (css) de BootStrap y las librerías JavaScript de BootStrap, JQuery y Pooper.

Una de las opciones es editando el fichero angular.json, e incluirlas en los campos styles y scripts.

El fichero quedaría algo así como esto:

Recordar que hay que parar el servidor de node.js y volverlo a ejecutar con **ng serve **si modificamos el fichero angular.json

Otra manera de incluir estos ficheros seria añadirlos en index.html, dentro de HEAD. Esto si fuera un proyecto habitual en HTML.

  1. Usando CDN

En este caso, no bajamos nada locamente y lo que hacemos es incluir los enlaces hacia los correspondientes ficheros en interner.

Así, como explican en la pagina de  BootStrap CDN, añadiríamos esta linea para incluir bootstrap versión 4.1.3

Y esta linea para incluir JQuery y Pooper