Bootstrap4 dependency PopperJs lance une erreur sur Angular

je viens de créer un tout nouveau projet

et a couru npm install bootstrap@4.0.0-beta jquery popper.js --save

et changé le .angulaire de la cli.JSON 's Parties connexes comme ci-dessous 

  "styles": [
    "../node_modules/bootstrap/dist/css/bootstrap.css"
  ],
  "scripts": [
    "../node_modules/jquery/dist/jquery.js",
    "../node_modules/popper.js/dist/popper.js",
    "../node_modules/bootstrap/dist/js/bootstrap.js"
  ],

cependant, la réception de l'erreur en dessous de 

10:2287 Uncaught SyntaxError: Unexpected token export
    at eval (<anonymous>)
    at webpackJsonp.../../../../script-loader/addScript.js.module.exports (addScript.js:9)
    at Object.../../../../script-loader/index.js!../../../../popper.js/dist/popper.js (popper.js?4b43:1)
    at __webpack_require__ (bootstrap 4403042439558687cdd6:54)
    at Object.2 (scripts.bundle.js:66)
    at __webpack_require__ (bootstrap 4403042439558687cdd6:54)
    at webpackJsonpCallback (bootstrap 4403042439558687cdd6:25)
    at scripts.bundle.js:1

vous savez comment le réparer?

merci d'avance...

75
demandé sur cilerler 2017-08-12 06:05:04

4 réponses

si vous regardez la page bootstrap ( http://getbootstrap.com / ) on peut voir qu'ils importent ce qui suit: 

https://code.jquery.com/jquery-3.2.1.slim.min.js
https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js
https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js

Notez le nom: jquery. slim .min.js, umd / popper.min.js

donc j'ai utilisé ce qui suit dans mon .angular-cli.json : 

      "styles": [
        "../node_modules/bootstrap/dist/css/bootstrap.css"
      ],
      "scripts": [
        "../node_modules/jquery/dist/jquery.slim.min.js",
        "../node_modules/popper.js/dist/umd/popper.min.js",
        "../node_modules/bootstrap/dist/js/bootstrap.min.js"
      ],

après ça, ça semble fonctionner maintenant.

182
répondu Martin Bauer 2017-08-12 11:23:11

j'ai eu le même problème. Ma solution était et non pour importer le dist-folder (./ node_modules / popper.js / dist / popper.js) mais plutôt le dossier umd (./ node_modules / popper.js / dist / umd / popper.js). Peu importe si vous obtenez la version mini ou normale du fichier js.

31
répondu Björn Bergenheim 2017-10-06 14:30:21

je peux voir que beaucoup de gens ont du mal à ajouter et correctement inclure Bootstrap 4 dépendances (jQuery, popper.JS etc.). Mais il y a une solution beaucoup plus facile sous la forme de https://ng-bootstrap.github.io .

ng-bootstrap offre native Angulaire des directives écrites à partir du sol. La conséquence positive est que: * vous n'avez pas besoin d'inclure et de s'inquiéter à propos de jQuery, popper.JS etc. * directive fournir des API qui "ont du sens" dans le monde angulaire

pour toute personne essayant d'utiliser Bootstrap 4.beta avec Angular-ng-bootstrap vient de sortir sa première beta entièrement compatible avec Bootstrap 4.beta CSS

2
répondu pkozlowski.opensource 2017-08-12 06:34:36

j'ai le même problème, et ça craint... mais si vous importez directement sur l'index.html sur la balise head, comme bootrstrap say, pas avec npm... vous obtenir de bons résultats. qui ne jetez pas les problèmes... mais est seulement un patch. Mais si l'utilisateur n'a pas internet, est une autre histoire.

0
répondu Acraciel 2017-08-12 06:22:54