Hello to all, welcome to therichpost.com. In this post, I will tell you, How to Add Bootstrap in Angular 11?
Angular 11 came and if you are new in angular then please check below two links for better understanding:
Here is the code snippet for Add Bootstrap in Angular 11 and follow carefully:
1. Here are the basics commands to install angular 11 on your system:
npm install -g @angular/cli ng new angularboot //Create new Angular Project cd angularboot // Go inside the Angular Project Folder ng serve --open // Run and Open the Angular Project http://localhost:4200/ // Working Angular Project Url
2. After done with above, you need to run below commands to set bootstrap environment into your angular 11 application:
npm install --save bootstrap
3. Now you need to add below code into your angular.json file:
... "styles": [ ... "node_modules/bootstrap/dist/css/bootstrap.min.css" ], "scripts": [... "node_modules/bootstrap/dist/js/bootstrap.min.js" ] ...
4. Now you need to add below code into src/app/app.component.html file:
<div class="container mt-5 mb-5"> <h1>Bootstrap is working fine with Angular 11!!</h1> </div>
In the end, don’t forgot to run ng serve command. If you have any query then do comment below.