如何使下拉菜单在引导5中使用popperjs工作

Question

我目前正在尝试使下拉菜单在Bootstrap 5中工作。我读到这个功能需要Popper.js，但我不知道如何正确地包含它(Laravel使用Laravel )。

我试过以下几种方法。

window.Popper = require(“@popperjs/core”)

import { createPopper } from '@popperjs/core'

import '@popperjs/core'

所有这些似乎没有启用我想要的引导下拉功能！我做错了什么？

Answer 1

你试过处理bootstrap.js文件了吗？

window.Popper = require('popper.js').default;
window.$ = window.jQuery = require('jquery');

require('bootstrap');

安装laravel时使用此文件

Answer 2

下面的操作将有效，因此不建议使用Popper.js。安装版本2..。

npm i @popperjs/core

然后在你的bootstrap.js..。

try {
    window.Popper = require('@popperjs/core');
    window.$ = window.jQuery = require('jquery');

    require('bootstrap');
} catch (e) {
}

最后，运行npm run dev并在布局中包含以下内容.

<!-- Scripts -->
<script src="{{ asset('js/app.js') }}" defer></script>