Install bootstrap in Angular
Step 1: #
npm i bootstrap @fortawesome/fontawesome-free --save
Step 2: #
CDN fontwesome - search in google
CDN JS - Click here
Copy the first link from the tag.
Open
index.html
and paste the link copied from the site in the<head>
section.
Step 3: #
Configuring bootstrap and fontawesome in angular app
Open
angular.json
search for styles and scripts array inside
build
object.Copy below and paste there. [ Note : if this not working try to do it manually. ]
"styles": [
"node_modules/@fortawesome/fontawesome-free/css/all.css",
"node_modules/bootstrap/dist/css/bootstrap.css",
"src/styles.css",
],
"scripts": [
"node_modules/bootstrap/dist/js/bootstrap.bundle.js",
]
Step 4: #
Google font : Ubuntu font
Go to google font official site Click here and search for Ubuntu font.
Copy the import statement and paste that in the global
style.css
file so that it will be accessible in all the pages.
body {
font-family: "Ubuntu", sans-serif !important;
}
- In
app.component.html
<button type="button" class="btn btn-success">Click Me</button>
Note : Check if the color of the button is green then it means that we have successfully installed bootstrap in angular app.