Para habilitar Bootstrap en nuestro proyecto, tenemos que seguir los siguientes pasos:
- Instalar Bootstrap y Librería de Iconos: «npm install bootstrap bootstrap-icons»
- En el fichero «angular.json», tendremos que añadir estas líneas allí donde estén definidos los estilos y los scripts; debería quedar como sigue:
- «styles»: [
- «node_modules/bootstrap/scss/bootstrap.scss»,
- «node_modules/bootstrap-icons/font/bootstrap-icons.css»,
- «src/styles.scss»
- ],
- «scripts»: [
- «node_modules/bootstrap/dist/js/bootstrap.bundle.min.js»
- ]
- A continuación, instalamos el soporte nativo de Angular: «npm install @ng-bootstrap/ng-bootstrap@next»
- Ahora ya podemos, por ejemplo, probar a añadir un botón de prueba y ver que se compila correctamente. Añadimos al final de nuestro fichero «app.component.html» lo siguiente, al final del fichero:
- <button class=»btn btn-danger»>Prueba botón</button>
- Observamos que como resultado obtenemos:
