Submodule 19.2: Getting Started with Angular
Installing Bootstrap
To install Bootstrap in our Angular application, open your Terminal, move to the angularChocoYourname
angular-sub-folder, and run the command:
npm install bootstrap@4.1.1 --save
Note that:
- Using the
--save
option the dependency will be saved inpackage.json
(Image 1) - As npm informs us, we are not able to use the JavaScript-based Bootstrap classes because these need the jquery and popper libraries. We will solve this problem later. (Image 2)
Now that the project is set up it must be configured to include the bootstrap CSS.
- Open the file
angular-cli.json
from the root of your project. - Inside
apps
locate thestyles
property. - This property allows external global styles to be applied to your application.
- Specify the path to bootstrap.min.css adding the code:
"../node_modules/bootstrap/dist/css/bootstrap.min.css",
- It should look like the (Image 3) when you are done.