Javascript 即使在包含 popper.js 之后仍然收到“未捕获的错误:Bootstrap 下拉列表需要 Popper.js”
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/45743072/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Still getting "Uncaught Error: Bootstrap dropdown require Popper.js" even after including popper.js
提问by Pavan
New to Angular and Bootstrap and I am trying little hands on by creating helloworld app. I have added required libraries but I am stuck at this error
我是 Angular 和 Bootstrap 的新手,我正在尝试通过创建 helloworld 应用程序来进行一些操作。我已经添加了所需的库,但我遇到了这个错误
Uncaught Error: Bootstrap dropdown require Popper.js
未捕获的错误:Bootstrap 下拉菜单需要 Popper.js
I have added the popper.js script, after the jquery and before bootstrap js. but still browser throws the error.
我在 jquery 之后和 bootstrap js 之前添加了 popper.js 脚本。但浏览器仍然抛出错误。
Please help.
请帮忙。
code looks like this:
代码如下所示:
<!DOCTYPE html>
<html ng-app="helloWorld" lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport"
content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>Index</title>
<link href="css/bootstrap.min.css" rel="stylesheet">
</head>
<body ng-controller="mainCtrl">{{message}}
<script src="js/angular.min.js" type="text/javascript"></script>
<script src="js/jquery-3.2.1.slim.min.js" type="text/javascript"></script>
<script src="js/popper.min.js" type="text/javascript"></script>
<script src="js/bootstrap.min.js" type="text/javascript"></script>
<script src="app/app.js" type="text/javascript"></script>
</body>
</html>
回答by Konrad
This worked for me :
这对我有用:
- use popper.js which are in the folder named "umd" in the download you find here https://popper.js.org
- do notsave the files in the same folder as your bootstrap.js but create a separate folder named "umd"
- declare popper.js before bootstrap.js
- 使用位于此处下载的名为“umd”的文件夹中的 popper.js https://popper.js.org
- 不要将文件保存在与 bootstrap.js 相同的文件夹中,而是创建一个名为“umd”的单独文件夹
- 在 bootstrap.js 之前声明 popper.js
So, in your case, change
所以,在你的情况下,改变
<script src="js/popper.min.js" type="text/javascript"></script>
to
到
<script src="js/umd/popper.min.js" type="text/javascript"></script>
回答by bflint
Indra4ev3r's answer worked for me on VS2015 Update 3 for an MVC5 project. Eg, switched popper before bootstrap.
Indra4ev3r 的回答对我在 VS2015 Update 3 的 MVC5 项目中起作用。例如,在引导之前切换 popper。
bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include(
"~/Scripts/umd/popper.js",
"~/Scripts/bootstrap.js"));
回答by Indra4ev3r
Had the same problem and solved it. Hope it helps!
有同样的问题并解决了它。希望能帮助到你!
If you are using Bootstrap.js in your project then it requires jquery and popper.js to run ahead of bootstrap. below steps might solve the issue:
如果你在你的项目中使用 Bootstrap.js 那么它需要 jquery 和 popper.js 在 bootstrap 之前运行。以下步骤可能会解决问题:
cd to the Project's folder or cd to project's bootstrap folder. Execute:
npm install popper.js --saveGo to http://getbootstrap.com/docs/4.0/getting-started/download/Copy the script and link contents under Bootstrap CDN section which states - If you're using our compiled JavaScript, don't forget to include CDN versions of jQuery and Popper.js before it.
Your index.html file might have to look like this: (Based on the versions of the jquery and popper.js) You are basically looking for 3 script src = "" tags in the following order jquery > popper.js > bootstrap.js note: editor doesnt allow me to add script tags. pls add them.
src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"> src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js" integrity="sha384-b/U6ypiBEHpOf/4+1nzFpr53nxSS+GLCkfwBdFNTxtclqqenISfwAzpKaMNFNmj4" crossorigin="anonymous"> src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js" integrity="sha384-h0AbiXch4ZDo7tp9hKZ4TsHbi047NrKGLO3SEJAg45jXxnGIfYzk4Si90RDIqNm1" crossorigin="anonymous">
cd 到项目的文件夹或 cd 到项目的 bootstrap 文件夹。执行:
npm install popper.js --save转到http://getbootstrap.com/docs/4.0/getting-started/download/复制 Bootstrap CDN 部分下的脚本和链接内容 - 如果您使用的是我们编译的 JavaScript,请不要忘记包含 CDN 版本在它之前的 jQuery 和 Popper.js。
您的 index.html 文件可能必须如下所示:(基于 jquery 和 popper.js 的版本)您基本上是在寻找 3 个脚本 src = "" 标签,顺序如下 jquery > popper.js > bootstrap.js注意:编辑器不允许我添加脚本标签。请添加它们。
src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"> src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js" integrity="sha384-b/U6ypiBEHpOf/4+1nzFpr53nxSS+GLCkfwBdFNTxtclqqenISfwAzpKaMNFNmj4" crossorigin="anonymous"> src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js" integrity="sha384-h0AbiXch4ZDo7tp9hKZ4TsHbi047NrKGLO3SEJAg45jXxnGIfYzk4Si90RDIqNm1" crossorigin="anonymous">
回答by Hulu Shao
I got this error in VisualStudio 2017 too.
我也在 VisualStudio 2017 中遇到了这个错误。
when I deleted "min" in this line
当我在这一行中删除“min”时
<script src="Scripts/popper.min.js"></script>
as
作为
<script src="Scripts/popper.js"></script>
and the DropDownMenu function worked!
并且 DropDownMenu 功能起作用了!

