I added bootstrap css in angular-cli.json - styles. Not applying bootstrap styles to my project. I added in package.json and did npm install. How to resolve this?
angular-cli.json
"styles": [ "styles.css", "../node_modules/bootstrap/dist/css/bootstrap.css" ] package.json
"dependencies": { "bootstrap": "^4.0.0-beta.2" } No need to update or reinstall your bootstrap just do below mentioned step it will work for you
open angular-cli.json inside styles array and specifying the path of bootstrap like this:
Angular-cli.json:
"styles": [ "./node_modules/bootstrap/dist/css/bootstrap.min.css", "styles.css" ], Open your style.css and paste this at the top:
@import url("../node_modules/bootstrap/dist/css/bootstrap.min.css") 
"../node_modules/bootstrap/dist/css/bootstrap.min.css" (which was the correct syntax up to Angular 5) with "./node_modules/bootstrap/dist/css/bootstrap.min.css" that is equivalent to "node_modules/bootstrap/dist/css/bootstrap.min.css" (which is the reccomended syntax starting from Angular 6). BUT the problem might be that you are writing such a line in the wrong "styles": [ .. ] array, since there are two of such arrays in angular.json, as @Goel points out here below
In your style.css add following line of code on top and let us know.
@import url("../node_modules/bootstrap/dist/css/bootstrap.min.css") Also check with following line too
@import url("./node_modules/bootstrap/dist/css/bootstrap.min.css") Hope it will help.
There is two styles declaration in angular.json file. One in Builder section and other one test's builder section. Make sure you are putting it in the right section.
"builder" : { ..... "styles" : [ // It should go here. Around line no. 27 "src/styles.css", "node_modules/bootstrap/dist/css/bootstrap.min.css" ], ..... }, "test": { ..... "styles" : [ // Not here! "src/styles.css", ], ..... } 
angular.json, if a ng serve is running you have to stop it by Ctrl+C and then run ng serve again.I faced the same problem. I tried to find what was the problem but got no result. I installed bootstrap using
npm install --save bootstrap which installed the latest bootstrap i.e. ver 4, so I deleted installed bootstrap from node_modules folder and updated dependency in packag.json file to earlier version
"bootstrap" : "^3.3.7" and ran
npm intstall After specifying the path of bootstrap file in angular style array as
"styles": [ "../node_modules/bootstrap/dist/css/bootstrap.min.css", "styles.css" ], it worked fine.
Step by step:
In terminal inside your app directory run:
npm install --save bootstrap Open angular.json and search for styles. At the beginning of the array paste the path to your bootstrap.min.css file
Should look like this:
"styles": [ "../node_modules/bootstrap/dist/css/bootstrap.min.css", "styles.css" ], Open your style.css and paste this at the top:
@import url("../node_modules/bootstrap/dist/css/bootstrap.min.css") Restart your server
paste following line of code in .angular-cli.json under styles: []
"../node_modules/bootstrap/dist/css/bootstrap.css"
inside angular-cli.json in
"styles": [ "../node_modules/bootstrap/dist/css/bootstrap.min.css", "styles.css" ], 
