Angular: Install Bootstrap and ng-bootstrap

Learn how to install Bootstrap (and ng-bootstrap) into your Angular web application.

Prerequisites

  1. Create a web application with Angular CLI

The Short Version

1. Run this command from your shell:

ng add @angular/localize

2. Run this command from your shell:

npm install bootstrap

3. Add a reference to the Bootstrap library to the src/app/styles.css file:

styles.css:

@import '~bootstrap/dist/css/bootstrap.css';

4. Run this command from your shell:

npm install @ng-bootstrap/ng-bootstrap

5. Add NgbModule to the list of imports in your @NgModule in the file src/app/app.module.ts:

src/app/app.module.ts:

import {NgbModule} from '@ng-bootstrap/ng-bootstrap';

@NgModule({
  ...
  imports: [NgbModule, ...],
  ...
})
export class AppModule {
  ...
}

Versions: