Bootstrap.min.js: 6 Ошибка при отсутствии: для выпадающего списка Bootstrap требуется Popper.js

Внезапно я начал получать ошибку, когда пытаюсь открыть раскрывающееся меню:

 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

Я использую стандартный файл начальной загрузки

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

Что-нибудь изменилось в bootstrap, я должен позаботиться?

Порядок загрузки файлов происходит

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

Ответ 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>

Ответ 2

Bootstrap 4 еще не является зрелым инструментом. Часть потребности в другом плагине для работы еще более сложна, особенно для разработчиков, которые некоторое время использовали Bootstrap. Я видел много способов устранить ошибку, но не все работают для всех. Я думаю, что лучший и самый чистый способ работы с Bootstrap 4. Среди установочных файлов Bootstrap есть один с именем "bootstrap.bundle.js" который уже поставляется с включенным Поппером.

Ответ 3

Для начальной загрузки 4 и позже используйте этот файл:

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

Вместо этого:

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

Ответ 4

Для правильной работы 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>

Ответ 5

включайте popper.js перед bootstrap.min.js

<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.0.4/popper.js"></script>

используйте эту ссылку, чтобы получить поппер

Ответ 6

используйте эту версию popper: popper.min.js

Ответ 7

Как указано здесь, вы должны использовать скрипт в подкаталоге 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",

Ответ 8

У меня была эта проблема с проектом MVC, и вот как я ее исправил.

Откройте BundleConfig.cs
Найти:

bundles.Add(new ScriptBundle ("~/bundles/bootstrap"). Include ("~/Scripts/bootstrap.js"));

Изменить на:
```
bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include("~/Scripts/bootstrap.bundle.min.js"));
```

Это установит файл пакета для загрузки. Это уже в правильном порядке. Вам просто нужно убедиться, что вы отображаете этот пакет в своем представлении.

Ответ 9

В моем случае я использую пакеты Visual Studio и Nuget, потому что они дублируют библиотеки, находящиеся в одной папке с jQuery, а другие в папке umd. Удаление javascript файлов popper с того же уровня, что и jQuery, и обращение к popper.js в папке umd устранили мою проблему, и я могу правильно видеть всплывающие подсказки.

Ответ 10

При переносе шаблона .html в WordPress я обнаружил, что этот "требуемый поппер" регулярно появляется:)

Для меня это произошло по двум причинам: и ошибка консоли может быть обманчива:

Ошибка в консоли может отправить вас по неверному пути. Это не может быть реальной проблемой. Первой причиной для меня был порядок order, в котором вы установили файлы .js для загрузки. В html легко разместите их в том же порядке, что и шаблон темы. В Wordpress вам нужно ставить их в правильном порядке, а также устанавливать приоритет, если они не отображаются в правильном порядке,
Второе - это файлы .js в заголовке или нижнем колонтитуле. Перемещение их в нижний колонтитул может решить проблему - для меня это произошло после целого дня попыток отладить проблему. Обычно это не имеет значения, но для сложной страницы с большим количеством js-библиотек это возможно!

Ответ 11

У меня была та же ошибка, и я просто хотел поделиться своим решением. Оказалось, что минимизированная версия popper содержит код в той же строке, что и комментарий, и поэтому весь код был закомментирован. Я просто нажал клавишу ввода после фактического комментария, чтобы код был в новой строке, а затем он работал нормально.

Ответ 12

Я столкнулся с этой проблемой, затем я поместил свой выпадающий список в теге nav. У меня так получилось.