bootstrap.min.js:6 Uncaught Error:Bootstrap下拉列表需要Popper.js

Question

突然,当我尝试打开下拉菜单时,我开始出错:

 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

我正在使用标准的bootstrap文件

<script src="https://getbootstrap.com/dist/js/bootstrap.min.js">

引导程序有什么变化我必须要小心吗？

订单我正在加载文件如下

<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>

Answer 1

你读过Bootstrap的介绍了吗？https://getbootstrap.com/docs/4.0/getting-started/introduction/#quick-start

您必须添加一些脚本才能使引导程序完全正常工作.按照这个确切的顺序包含它们非常重要.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>

Answer 2

Bootstrap 4还不是一个成熟的工具.需要另一个插件工作的部分甚至更复杂,特别是对于已经使用Bootstrap一段时间的开发人员.我已经看到很多方法可以消除错误,但不是所有人都能解决.我认为使用Bootstrap 4的最佳和最干净的方法.在Bootstrap安装文件中,有一个名为"bootstrap.bundle.js"的 内容已包含在Popper中.

Answer 3

对于引导程序4和更高版本，请使用以下文件：

/lib/bootstrap/dist/js/bootstrap.bundle.min.js

代替这个：

/lib/bootstrap/dist/js/bootstrap.min.js

Answer 4

在bootstrap.min.js之前包含popper.js https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.0.4/popper.js 使用此链接获取popper

Answer 5

为了使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>

Answer 6

正如这里所指出的，在我的情况下，您必须使用 UMD 子目录中的脚本

        bundles.Add(new ScriptBundle("~/bundles/projectbundle").Include(
            "~/Scripts/umd/popper.js",
            "~/Scripts/bootstrap.js",
            "~/Scripts/respond.js",
            "~/Scripts/summernote-bs4.js"));

具体来说：“~/Scripts/umd/popper.js”，

Answer 7

您需要安装 popperjs 和 bootstrap 来消除此错误。请注意，如果您使用 "bootstrap": "^4.4.1" 和 @popperjs/core v2.x 组合，bootstrap 可能不支持 popperjs 版本。所以降级你的版本。

选项1： npm install popper.js@^1.12.9 --save

并在 jquery 和 bootstrap 脚本之间添加以下脚本。

"node_modules/popper.js/dist/umd/popper.min.js",

选项 2：将以下脚本标签添加到index.html

<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