Dépendance Bootstrap4 PopperJs génère une erreur sur Angular

Je viens de créer un tout nouveau projet angular-cli
et a exécuté npm install bootstrap@4.0.0-beta jquery popper.js --save
et changé les parties liées à .angular-cli.json 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 recevoir l’erreur ci-dessous

 10:2287 Uncaught SyntaxError: Unexpected token export at eval () 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 

Toute idée de comment résoudre ce problème?

Merci d’avance…

Si vous regardez la page bootstrap ( http://getbootstrap.com/ ), vous pouvez voir qu’ils importent les éléments suivants:

 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

Par conséquent, 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 cela, cela semble fonctionner maintenant.

J’ai eu le même problème. Ma solution ne consistait pas à importer le dossier dist ( Peu importe si vous obtenez la version mini ou normale du fichier js.

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

ng-bootstrap fournit des directives angulars natives écrites à partir de zéro. La conséquence positive est que: * vous n’avez pas besoin d’inclure et de vous soucier de jQuery, popper.js, etc. * les directives fournissent des API qui “font sens” dans le monde angular

Pour quiconque essaie d’utiliser Bootstrap 4.beta avec Angular – ng-bootstrap vient de sortir sa première version bêta entièrement compatible avec Bootstrap 4.beta CSS

J’ai le même problème, et ça craint … mais si vous importez directement sur index.html sur la balise head, comme dit bootrstrap, pas avec npm … vous obtenez de bons résultats. ça ne pose pas de problèmes … mais ce n’est qu’un patch. Mais si l’utilisateur n’a pas internet, c’est une autre histoire.