How to install Bootstrap for Angular?

Run the following Command in Command prompt.

Angular 8 with Bootstrap
Angular 8 with Bootstrap

After that, when we use a project created with Angular CLI 6+, we will have an angular.json file instead of a.angular-cli.jsonfile. In that file, we need to add Bootstrap to the styles[]array, but the path should be node_modules/bootstrap/dist/css/bootstrap.min.css, NOT../node_modules/bootstrap/dist/css/bootstrap.min.css. The leading ../ must not be included.

Angular 8 with CLI

Here, we are using the Angular 8.1.0 version.

Process of adding a bootstrap.css file in the Project

Expand node module (library root folder)

Angular 8 with Bootstrap

Go to the bootstrap folder and expand it.

Annngular 8 Expand Root Folder

Go to dist folder and expand it.

Go to dist folder and expand it

Expand CSS, and we will find “bootstrap.css.” Expand bootstrap.css, and we will see bootstrap.min.css

Expand CSS

Open angular.js file and bootstrap.min.css in the style section.

Bootstrap is installed for your Angular 8 project. We can use it now.

Pin It on Pinterest

Share This