"Waves is not defined" 将 material 设计 bootstrap 包含在 webpack 中时出错

Question

我正在使用 webpack 来包含 mdbootstrap

这就是我将其包含在我的项目中的方式：

require('mdbootstrap/css/mdb.min.css');
require('mdbootstrap/js/mdb.min.js');

我也试过 require('mdbootstrap')，但在这两种情况下我都收到以下错误：

vendor.js:71728 Uncaught ReferenceError: Waves is not defined
at Object.<anonymous> (vendor.js:71728)
at Object.<anonymous> (vendor.js:71729)
at __webpack_require__ (vendor.js:20)
at Object._require.modules (vendor.js:68202)
at __webpack_require__ (vendor.js:20)
at Object.defineProperty.value (vendor.js:68186)
at __webpack_require__ (vendor.js:20)
at Object.defineProperty.value (vendor.js:63)
at vendor.js:66

单独使用require('mdbootstrap/css/mdb.min.css');可以，但我还需要一个js文件。

Answer 1

我曾与：

命令：npm install node-waves

main.js 文件

var waves = required('node-waves')
window.Waves = waves

Answer 2

我也遇到这个问题，我在mdb.js文件中找到了Waves.js的代码，所以你不需要安装node-waves。我 google 的解决方案是注释 mdb.js

中的那些代码

Waves.attach(‘.btn, .btn-floating’, [‘waves-light’]);
Waves.attach(‘.waves-light’, [‘waves-light’]);
Waves.attach(‘.navbar-nav a:not(.navbar-brand), .nav-icons li a, .navbar form, .nav-tabs .nav-item’, [‘waves-light’]);
Waves.attach(‘.pager li a’, [‘waves-light’]);
Waves.attach(‘.pagination .page-item .page-link’, [‘waves-effect’]);
Waves.init();/* FORMS */

这是我的工作。我的 mdb 版本是 4.3.2.

Answer 3

如果您使用 Vue，这是对我有用的解决方案：

安装 node-waves:

npm install node-waves --save

在webpack中声明（在webpack.dev.conf.js和webpack.prod.conf.js中）：

new webpack.ProvidePlugin({
  'Waves': 'node-waves'
}),

"Waves is not defined" 将 material 设计 bootstrap 包含在 webpack 中时出错

"Waves is not defined" error while including material design bootstrap with webpack

twitter-bootstrap

material-design

webpack-2