Question

我有一个基本的单页React / Redux应用程序，我使用Webpack捆绑，所有工作正常，但我尝试加载materialize-css js文件时出现以下错误。我尝试从NPM模块和编译源加载，错误是相同的。

WARNING in ./~/jQuery/dist/jquery.js
There is another module with an equal name when case is ignored.
This can lead to unexpected behavior when compiling on a filesystem with other case-semantic.
Rename module if multiple modules are expected or use equal casing if one module is expected.

WARNING in ./~/jquery/dist/jquery.js
There is another module with an equal name when case is ignored.
This can lead to unexpected behavior when compiling on a filesystem with other case-semantic.
Rename module if multiple modules are expected or use equal casing if one module is expected.

我正在加载条目文件顶部的所有内容，如下所示：

import React from 'react';
import ReactDOM from 'react-dom';
import { Provider } from 'react-redux';
import { createStore, applyMiddleware } from 'redux';
import ReduxPromise from 'redux-promise';

import App from './components/app'
import reducers from './reducers'

require('../materialize/css/materialize.css');
require('../materialize/js/materialize.js');
require("../style/main.scss");

和JQuery从NPM模块加载如下：

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

现在一切仍然有效，它会加载所有字体，js文件，并且应用程序中的所有工作/看起来都是正确的，但有一个警告是有原因的，所以我真的想让它消失！

如果您需要更多信息，请与我们联系。

您可以在此处查看完整的源代码https://github.com/gazzer82/freeCodeCamp_Recipes

由于

Answer 1

好的，所以我通过在materialize.js中更改它来修复此问题

jQuery = $ = require('jQuery');

到此

jQuery = $ = require('jquery');

简单。。。

Answer 2

幸运的是，没有必要更改materialize.js： - ）

在webpack配置中添加：

module.exports = {
  // ...
  resolve: {
      alias: {
        jQuery: "path/to/jquery/dist/jquery"
      }
  }
  // ...
};

此处有更多详情：https://github.com/Dogfalo/materialize/issues/2690

如果忽略大小写，则使用materialize-css和Webpack，具有相同名称的模块的问题，JQuery

2 个答案: