Angular

Last Updated: 6/15/2023

Add Bootstrap

  • Boostrap is a css library that gives app modern look and feel
  • Installing Bootstrap
npm install bootstrap --save
  • npm download the package and place it in node_modules folder
  • --save option adds an entry as a dependency in package.json
  • ^3.3.7: major.minor.patch
  • ^: indicates you can upgrade to the most recent version like 3.3, 3.4, 3.5, but not 4.0 or 5.0
  • Benefit of listing dependency in package.json
  • node_modules will not be checked into source control repository because it takes lot of disk space
  • Whenever you download code just run the command to install all dependencies
npm install

Using Bootstrap

  • In styles.css, add the import statement. Path relative to the node_modules folder
@import "~bootstrap/dist/css/bootstap.css"

or

  • In angular.json, in styles array add
"styles":  [  
	"node_modules/bootstrap/dist/css/bootstrap.css",  
	"src/styles.css"  
]
Previous
Next