Javascript bootstrap.min.js:6 未捕获错误：Bootstrap 下拉菜单需要 Popper.js
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/45661863/
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
bootstrap.min.js:6 Uncaught Error: Bootstrap dropdown require Popper.js
提问by Ilya Bibik
Suddenly I started to get error when I try to open my dropdown menu :
当我尝试打开下拉菜单时，突然出现错误：
bootstrap.min.js:6 Uncaught Error: Bootstrap dropdown require Popper.js (https://popper.js.org)
at bootstrap.min.js:6
at bootstrap.min.js:6
at bootstrap.min.js:6
I am using standard bootstrap file
我正在使用标准引导程序文件
<script src="https://getbootstrap.com/dist/js/bootstrap.min.js">
<script src="https://getbootstrap.com/dist/js/bootstrap.min.js">
Anything changed in bootstrap I have to take care off?
引导程序中的任何更改我都必须注意？
Order I am loading files is following
我正在加载文件的顺序如下
<script src="https://code.jquery.com/jquery-1.9.1.js"></script>
<script src="{{ STATIC_URL }}/static/jquery/jquery-1.9.1.js"></script>
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<script src="{{ STATIC_URL }}/static/jquery/jquery-ui.js"></script>
<script src="https://getbootstrap.com/dist/js/bootstrap.min.js"></script>
<!-- Just to make our placeholder images work. Don't actually copy the next line! -->
<script src="https://getbootstrap.com/assets/js/vendor/holder.min.js"></script>
<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
<script src="https://getbootstrap.com/assets/js/ie10-viewport-bug-workaround.js"></script>
回答by SeppeDev
Did you read the introduction of Bootstrap? https://getbootstrap.com/docs/4.0/getting-started/introduction/#quick-start
你读过 Bootstrap 的介绍吗？https://getbootstrap.com/docs/4.0/getting-started/introduction/#quick-start
You have to add some scripts in order to get bootstrap fully working. It's important that you include them in this exact order. Popper.js is one of them:
您必须添加一些脚本才能使引导程序完全正常工作。按此确切顺序包含它们很重要。Popper.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.11.0/umd/popper.min.js" integrity="sha384-b/U6ypiBEHpOf/4+1nzFpr53nxSS+GLCkfwBdFNTxtclqqenISfwAzpKaMNFNmj4" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js" integrity="sha384-h0AbiXch4ZDo7tp9hKZ4TsHbi047NrKGLO3SEJAg45jXxnGIfYzk4Si90RDIqNm1" crossorigin="anonymous"></script>
回答by Shadi Namrouti
For bootstrap 4 and later, use this file:
对于引导程序 4 及更高版本，请使用此文件：
/lib/bootstrap/dist/js/bootstrap.bundle.min.js
Instead of this:
取而代之的是：
/lib/bootstrap/dist/js/bootstrap.min.js
回答by HHungria
Bootstrap 4 is not yet a mature tool yet. The part of requiring another plugin to work is even more complicated especially for developers who have been using Bootstrap for a while. I have seen many ways to eliminate the error but not all work for everyone. I think the best and cleanest way to work with Bootstrap 4. Among the Bootstrap installation files, There is one with the name "bootstrap.bundle.js"that already comes with the Popper included.
Bootstrap 4 还不是一个成熟的工具。需要另一个插件才能工作的部分更加复杂，尤其是对于已经使用 Bootstrap 一段时间的开发人员而言。我已经看到了许多消除错误的方法，但并非所有方法都适用于每个人。我认为使用 Bootstrap 4 的最佳和最干净的方法是在 Bootstrap 安装文件中，有一个名为“bootstrap.bundle.js”的文件已经包含在 Popper 中。
回答by Anoop Nockson
include popper.js before bootstrap.min.js
在 bootstrap.min.js 之前包含 popper.js
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.0.4/popper.js"></script>
use this link to get popper
使用此链接获取 popper
回答by David Salomon Rojas Llaullipom
In order for Bootstrap Beta to function properly, you must place the scripts in the following order.
为了使 Bootstrap Beta 正常运行，您必须按以下顺序放置脚本。
<script src="js/jquery-3.2.1.min.js"></script>
<script src="js/popper.min.js"></script>
<script src="js/bootstrap.min.js"></script>
回答by William T. Mallard
As pointed out hereyou must use the script in the UMD subdirectory, in my case
正如这里所指出的，在我的情况下，您必须使用 UMD 子目录中的脚本
bundles.Add(new ScriptBundle("~/bundles/projectbundle").Include(
"~/Scripts/umd/popper.js",
"~/Scripts/bootstrap.js",
"~/Scripts/respond.js",
"~/Scripts/summernote-bs4.js"));
Specifically this: "~/Scripts/umd/popper.js",
具体来说：“~/Scripts/umd/popper.js”，
回答by AriBaa Games
I had this issue with an MVC project and here is how I fixed it.
我在 MVC 项目中遇到了这个问题，这是我修复它的方法。
- Open BundleConfig.cs
Find :
bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include("~/Scripts/bootstrap.js"));
Change to:
bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include("~/Scripts/bootstrap.bundle.min.js"));
- 打开BundleConfig.cs
找 ：
bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include("~/Scripts/bootstrap.js"));
改成：
bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include("~/Scripts/bootstrap.bundle.min.js"));
This will set the bundle file to load. It is already in the correct order. You just have to make sure that you are rendering this bundle in your view.
这将设置要加载的包文件。它已经是正确的顺序。您只需要确保在视图中呈现此包。
回答by mbadeveloper
In my case I am using Visual Studio and Nuget packages its failing because have duplicated libraries one in the same folder as jQuery and another in the folder umd. By removing the popper javascript files from the same level as jQuery and refere to the popper.js inside the umd folder fixed my issue and I can see the tooltips correctly.
在我的情况下，我使用 Visual Studio 和 Nuget 包失败，因为在与 jQuery 相同的文件夹中复制了一个库，另一个在文件夹 umd 中。通过从与 jQuery 相同的级别删除 popper javascript 文件并参考 umd 文件夹中的 popper.js 修复了我的问题，我可以正确地看到工具提示。
回答by Mark Zee
On moving a .html template to a wordpress one, I found this "popper required" popping up regularly :)
在将 .html 模板移动到 wordpress 模板时，我发现这个“需要 popper”会定期弹出:)
Two reasons it happened for me: and the console error can be deceptive:
它发生在我身上的两个原因：控制台错误可能具有欺骗性：
The error in the console can send you down the wrong path. It MIGHT not be the real issue. First reason for me was the orderin which you have set your .js files to load. In html easy, put them in the same order as the theme template. In Wordpress, you need to enqueue them in the right order, but also set a priority if they don't appear in the right order,
Second thing is are the .js files in the header or the footer. Moving them to the footer can solve the issue - it did for me, after a day of trying to debug the issue. Usually doesn't matter, but for a complex page with lots of js libraries, it might!
控制台中的错误可能会让您走上错误的道路。这可能不是真正的问题。我的第一个原因是您设置 .js 文件加载的顺序。在 html easy 中，将它们按与主题模板相同的顺序排列。在 Wordpress 中，您需要以正确的顺序将它们入队，但如果它们没有以正确的顺序出现，也要设置优先级，
第二件事是页眉或页脚中的 .js 文件。将它们移到页脚可以解决问题 - 经过一天的尝试调试问题后，它对我来说确实如此。通常无关紧要，但对于具有大量 js 库的复杂页面，它可能会！
回答by Irfan
I had the same error and just wanted to share my solution. In turned out that the minified version of popper had the code in the same line as the comment and so the entire code was commented out. I just pressed enter after the actual comment so the code was on a new line and then it worked fine.
我有同样的错误，只是想分享我的解决方案。结果证明，popper 的缩小版本的代码与注释在同一行，因此整个代码都被注释掉了。我只是在实际注释后按 Enter 键，所以代码在新行上，然后它工作正常。
