How to implement Bootstrap 4 in Angular CLI
I am not able to use Bootstrap with Angular CLI. I'm using ng-bootstrap and I'm following all the recommendations of the site, but without success, does anyone know how to use?
Installation via npm:
npm install --save @ng-bootstrap/ng-bootstrap
Importing into the main module, with the .forRoot ():
import {NgbModule} from '@ng-bootstrap/ng-bootstrap';
@NgModule({
declarations: [AppComponent, ...],
imports: [NgbModule.forRoot(), ...],
bootstrap: [AppComponent]
})
export class AppModule {}
Importing into the module with the component I'm using:
import {NgbModule} from '@ng-bootstrap/ng-bootstrap';
@NgModule({
declarations: [OtherComponent, ...],
imports: [NgbModule, ...]
})
export class MeuModule {}
0
3 answers
You need to add the Bootstrap in your project:
npm install bootstrap@4 --save
Then edit the file .angular-cli.json :
"styles": [
"styles.css",
"../node_modules/bootstrap/dist/css/bootstrap.min.css"
],
1
Author: NoobSaibot, 2018-04-11 12:02:06
Ok. The problem here is that you forget to add the css to your themese: D
In your main.scss
(or equivalent) you only have to import the SCSS from bootstrap:
// main.scss
// 3rd party libraries
@import "~bootstrap/scss/bootstrap";
And bootstrap styles are now on your style sheet
0
Author: MoshMage, 2018-04-10 13:20:11
Use the command npm install bootstrap --save
, and add the line:
"../node_modules/bootstrap/dist/css/bootstrap.min.css"
As in the example below:
"build": {
"options": {
"styles": [
"../node_modules/bootstrap/dist/css/bootstrap.min.css",(adicionar essa inha no angular.json)
"styles.css"
],
}
}
0
Author: Izaias Dantas, 2019-05-15 17:13:02