我刚刚创建了一个全新的angular-cli项目
并运行npm install bootstrap@4.0.0-beta jquery popper.js --save
并更改了.angular-cli.json's相关部分,如下所示
"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"
],
但是,收到下面的错误
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
你知道怎么修复它吗?
发布于 2017-08-12 19:23:12
查看https://getbootstrap.com/docs/4.2/getting-started/introduction/#js上的文档,您可以看到它们导入了以下内容:
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
注意命名: jquery.slim.min.js,umd/popper.min.js!
因此,我在.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"
],
在那之后,它现在似乎起作用了。
发布于 2017-10-06 22:30:22
我也有同样的问题。我的解决方案是导入umd文件夹,而不是导入dist文件夹(./_/popper.js/dist/popper.js)无论您获得的是js-file的迷你版本还是普通版本。
发布于 2017-08-12 14:34:36
我可以看到很多人都在努力添加并正确地包含Bootstrap4依赖项(jQuery、popper.js等)。但是有一个更简单的解决方案,那就是https://ng-bootstrap.github.io。
ng-bootstrap提供了从头开始编写的本地Angular指令。积极的结果是:*您不需要包含和担心jQuery、popper.js等。*指令提供了在Angular世界中“有意义”的API
对于任何试图使用带Angular - ng-bootstrap的Bootstrap 4.beta的人来说,刚刚发布了它的第一个测试版,它与Bootstrap 4.beta CSS完全兼容
https://stackoverflow.com/questions/45646101
复制相似问题