javascript - 如何将 popper.js 添加到 Laravel 8 with Bootstrap 5 项目？

Question

我正在使用 Laravel 8 和 Bootstrap 5 制作博客应用程序。我使用放置在 Bootstrap 模态中的表单来添加帖子。此外，我在项目中包含了一个 JavaScript 文件。

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

在 resources/js 中，我有一个 app.js 和一个 bootstrap.js 文件。在 app.js 中，我需要 bootstrap.js 和

require('./bootstrap')

从 webpack.mix.js 我将所有这些编译成单个 JavaScript 文件 public\js\app.js:

mix.js('resources/js/app.js', 'public/js')
    .sass('resources/sass/app.scss', 'public/css')
    .sourceMaps();

我想将 popper.js 添加到项目中，像这样:

require('./popper');
require('./bootstrap');

但是，为此，我需要 resources/js 中的 popper.js 以及其他两个文件。所以，我做了 npm i @popperjs/core 和 npm run dev。但它不编译，我没有在上面提到的 js 目录中得到 popper.js。那么，我该如何解决这个问题呢？

Answer 1

1 - 使用此命令安装 @popperjs/core:npm i @popperjs/core

2 - 将此行添加到您的 bootstrap.js 文件中:

window.Popper = require('@popperjs/core');

3 - 运行此命令:npm run dev

4 - 现在您可以访问 Blade 文件中的 window.Popper。