npm not installing latest version ngx-bootstrap in Angular 11

Question

ng add ngx-bootstrap Installing packages for tooling via npm. Installed packages for tooling via npm. An unhandled exception occurred: Cannot find module '@schematics/angular/utility/config' Require stack:

• C:\client\node_modules\ngx-bootstrap\schematics\ng-add\index.js
• C:\client\node_modules@angular-devkit\schematics\tools\export-ref.js
• C:\client\node_modules@angular-devkit\schematics\tools\index.js
• C:\client\node_modules@angular\cli\utilities\json-schema.js
• C:\client\node_modules@angular\cli\models\command-runner.js
• C:\client\node_modules@angular\cli\lib\cli\index.js
• C:\Users\Jaswik\AppData\Roaming\npm\node_modules@angular\cli\lib\init.js
• C:\Users\Jaswik\AppData\Roaming\npm\node_modules@angular\cli\bin\ng See "C:\Users\Jaswik\AppData\Local\Temp\ng-2BGEbQ\angular-errors.log" for further details.

Answer 1

First, you need to install ngx-bootstrap in your project from npm using:

npm install ngx-bootstrap --save

next, you need to add this link to your HTML file

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet">

you can also use the ng add command of Angular CLI 11 to automatically add ngx-bootstrap to your project by simpy running the following command:-

ng add ngx-bootstrap

this command will automatically add necessary files and also you can add ngx file individually by using this command

 ng add ngx-bootstrap --component accordion
 ng add ngx-bootstrap --component alerts
 ng add ngx-bootstrap --component buttons
 ng add ngx-bootstrap --component carousel
 ng add ngx-bootstrap --component collapse
 ng add ngx-bootstrap --component datepicker
 ng add ngx-bootstrap --component dropdowns
 ng add ngx-bootstrap --component modals
 ng add ngx-bootstrap --component pagination
 ng add ngx-bootstrap --component popover
 ng add ngx-bootstrap --component progressbar
 ng add ngx-bootstrap --component rating
 ng add ngx-bootstrap --component sortable
 ng add ngx-bootstrap --component tabs
 ng add ngx-bootstrap --component timepicker
 ng add ngx-bootstrap --component tooltip
 ng add ngx-bootstrap --component typeahead 

and if you want install bootstrap then install it First, we'll start by installing the dependencies using

npm install bootstrap --save

Next, you need to install ng-bootstrap from npm using the following command:-

npm install --save @ng-bootstrap/ng-bootstrap

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

and if you want to install bootstrap with Angular 11

npm install bootstrap --save

There are many ways to do that. The simpest method is by using the src/styles.css file and adding the following code:

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

if you want to install

Answer 2

I ran into this as well today. I don't have a solution, but someone else filed an issue with the project on Github

https://github.com/valor-software/ngx-bootstrap/issues/6037

Even with the error, ngx-bootstrap seems to have been properly installed for me.