Add Bootstrap in Angular 4

How to Add Or Install Bootstrap in Angular 4/2.

In this video, we will discuss how to add or install bootstrap in your angular 4 or 2 application.

2 methods are discussed
1. Direct Method
Using CDN Link.
2.Using npm or angular cli command
This method will allow us to use local bootstrap

Commands Used
npm install jquery --save

💖 Buy me a Coffee

🌀 Related Videos

🔗 Find me in

#Angular #Bootstrap #CodAffection

[xaviercompagnion]

Hi guys for all people whose script does not work, i had the same issue but I fixed it by modifyng the line : popper.js/dist/popper.min.js by

[yiyatsen]

Thank you very much. This save me a lot of time

[tyyist]

Thank you for this! This helped me out!

[pradeepgusain]

I am working on Anguar 5 with bootstrap version 3.3.7. Now, I want to upgrade to Bootstrap latest stable version. How to upgrade to the latest version?

[gayathriamirineni]

Hi, I have followed the same way to install Bootstrap. But still i am unable to get bootstrap installed successfully. I am getting the following error.
no such file or directory, open
I have done exactly the same as you did.
Please help me with this as fast as possible

[felipefc]

There seems to be an error on the jquery version you are installing. You should install jquery-slim not the full version. i spend half an hour figuring out why bootstrap was not loading.
If you use the full jquery then you don't need popper.js

It is either jquery full or jquery-slim + popper.js but jquery-full + popper.js gives an error.

[saleemahmad]

Sir How to include javascript Libraries..in second method its not working

[kushalsinha]

styles are showing as inline. I'cant see css line number or stylesheet name in inspect element !! help me (angular 4)

[NehaGupta-hnmm]

But why we using bootstrap js file
What's are role of ngx bootstrap

[ezragongati]

menu expansion is not working in second method what is the problem bro ?

[niyongaboeric]

thank you very much for this video, you saved me

[MedAbhiMinds]

The video is not running in Angular. Can you tell what it will be

[cuteiffatfatima]

error: enoent: no such file or directory, open

I am getting this error

[chaitraliuttekar]

Navigation not working in mobile view please help

[localhost]

Got this error: Cannot GET /

What should I do ? Thanks in advance.

[saleemahmad]

In second method javascript is not working..

[arunjiid]

hi sir I am facing this type problem I m using npm bootstrap but showing this error please reply where is problem
C:\autodesk\form>ng serve --open
91% additional asset processing scripts-webpack-plugin× ｢wdm｣: Error: ENOENT: no such file or directory, open
i ｢wdm｣: wait until bundle finished: /
i ｢wdm｣: wait until bundle finished: /

[rehanreza]

can anyone help me? i am getting below error

[samirrana]

In second method In restore down menu was not shown

[rehanreza]

i am strucked at here:
11% building modules 10/13 modules 3 active error from PostCSS plugin. Your current PostCSS version is 6.0.14, but autoprefixer uses 5.2.18. Perhaps this is the source of the error below.
91% additional chunk assets processingError: ENOENT: no such file or directory, open