0

In Bootstrap 4 beta there is a new dependency added, the popper.js. If I upgrade my npm dependencies in package.json to Bootstrap 4 beta and ng-bootstrap to 1.0.0-beta.5, I get "UNMET PEER DEPENDENCY" for popper.js. (When I call npm install.) However on the website of ng-bootstrap is written:

"No, the goal of ng-bootstrap is to completely replace JavaScript implementation for components. Nor should you include other dependencies like jQuery or popper.js. It is not necessary and might interfere with ng-bootstrap code."

So I don't see the point. If I don't add it, I get the Warning above written. But the website asks me not to add it. What did I get wrong?

I won't use popper, so if it is not necessary, I don't want to add it to my dependencies.

1
  • 1
    npm doesn't know about all that. You tell it to download bootstrap, bootstrap has a declared dependency on popper, so npm warns you about that. But since you're only interested in the CSS part of bootstrap, you know the popper dependency is not actually needed, so you can ignore the warning. Commented Oct 15, 2017 at 7:50

1 Answer 1

2

I ran into the same problem, and even if it is documented, it could be more explicit...

It is written in ng-bootstrap getting started that it depends on Angular AND Bootstrap. Therefore you need to include bootstrap in your package.json and reference css/js files in your .angular-cli.json

But as written, in Bootstrap source documentation, bootstrap.min.js does not include Popper (required by bootstrap). You'll need either to import Popper by yourself or use bootstrap.bundle.min.js instead of bootstrap.min.js

Here is the files :

package.json :

...
 "dependencies": {
    "@ng-bootstrap/ng-bootstrap": "^1.0.0-beta.9",
    "bootstrap": "^4.0.0-beta.3",
 },
...

app.module.ts :

...
  imports: [
   ...
   NgbModule.forRoot()
],
...

.angular-cli.json :

...
  "styles": [
    "styles.css",
    "../node_modules/bootstrap/dist/css/bootstrap.min.css"
  ],
  "scripts": [
    "../node_modules/jquery/dist/jquery.min.js",
    "../node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"
  ],
...
Sign up to request clarification or add additional context in comments.

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.