Question

我最近将我的项目从Meteor迁移到了Webpack，并且在尝试使用Materialise.css构建我的UI时遇到了错误。自定义实现函数（例如$(...).tooltip）会导致在控制台中抛出未捕获的TypeError。这不允许我在我的应用程序中使用Materialise。

在尝试在webpack应用程序中使用Materialize时，其他任何人都会遇到这类错误？任何关于如何解决这些问题的方向都将不胜感激。谢谢！

我用来加载Materialize模块及其依赖项的代码位于目录根目录下的index.js中。

index.js：

import 'materialize-loader';
import 'materialize-css/dist/css/materialize.css';
window.jQuery = require('jquery');
window.$ = require('jquery');
import 'materialize-css/dist/js/materialize.js';
import 'materialize-css/js/init.js';

Answer 1

同样遇到问题。您需要做的是在webpack配置中进行以下修改：

const webpack = require("webpack");

在导出选项中添加：

plugins: [
     new webpack.ProvidePlugin({
            $: "jquery",
            jQuery: "jquery",
            "window.$": "jquery",
            "window.jQuery": "jquery"
    }),

此外，从index.js中删除以下语句：

import 'materialize-loader';
window.jQuery = require('jquery');
window.$ = require('jquery');
import 'materialize-css/js/init.js';

注意：我在webpack 4+上对此进行了测试；不知道它是否适用于其他版本。

可能的解释：用于实现插件的js文件可能将window。$或window.jQuery用于jquery方法，并且可能必须在webpack配置中为其指定相同的全局别名。

实现jQuery函数在Webpack应用程序中不起作用

1 个答案: