如何使用jQuery slim和新的@popperjs构建带有Laravel-mix的Bootstrap 4?

问题描述 投票:0回答:3

[C0的内容:

webpack.mix.js

[C0的内容:

const mix = require('laravel-mix');

mix.js('resources/assets/js/vendor.js', 'public/js');

[构建后,在vendor.js文件中,我可以清楚地看到window.Popper = require('@popperjs/core').default; try { window.$ = window.jQuery = require('jquery/dist/jquery.slim.js'); require('bootstrap'); } catch (e) {} public/js/vendor.js被包含在@popperjs和旧的jquery.slim.js之上(它们重复)。

我知道这是因为jquery具有popperjs作为依赖项。

我如何使用新的node_modules\bootstrap\dist\js\bootstrap.jsrequire('jquery'), require('popper.js')构建资产,而没有旧的@popperjs和完整的jquery.slim.js版本?

javascript laravel webpack laravel-6 laravel-mix
3个回答
1
投票

它可以帮助您:popperjs

因此您可以单独导入插件,并使用较新的popperjs版本。但是请指望,引导4使用较新的popperjs版本可能不稳定。

Btw:引导程序5中有jquery几率。



0
投票

Bootstrap不会为您加载jQuery或popper。无论使用哪种软件包管理器,都必须自己加载它们。

来源:npm@popperjs/core

[[email protected]会将所有Bootstrap的jQuery插件加载到jQuery对象上。

如果在您的依赖项中找不到合适的https://getbootstrap.com/docs/4.0/getting-started/download/#package-managers软件包版本,安装require('bootstrap') Bootstrap软件包时,控制台会发出警告。

这也很容易测试:只需在要求Bootstrap之前不包括jQuery,打开控制台,得到一袋爆米花,点击刷新按钮,然后欣赏表演。


要在npm处找到webpack jquery(无论何时需要在应用程序中导入它,都可以在webpack配置的jquery中指定它:

window.jQuery

因此,在应用程序中使用externals的任何地方,实际上将使用完成要求/导入时的externals: { jquery: 'window.jQuery' }

© www.soinside.com 2019 - 2024. All rights reserved.