Search code examples
reactjsnode-modulesbabel-loader

React Node Modules conflict

(webpack)/buildin/global.js There are multiple modules with names that only differ in casing. This can lead to unexpected behavior when compiling on a filesystem with other case-semantic. Use equal casing. Compare these module identifiers:

  • C:\Users\user\Desktop\projects\LINK\LinkparmacySystem\node_modules\react-scripts\node_modules\babel-loader\lib\index.js??ref--5-oneOf-3!C:\Users\user\Desktop\projects\LINK\LinkparmacySystem\node_modules\webpack\buildin\global.js Used by 2 module(s), i. e. C:\Users\user\Desktop\projects\LINK\LinkparmacySystem\node_modules\react-scripts\node_modules\babel-loader\lib\index.js??ref--5-oneOf-3!C:\Users\user\Desktop\projects\LINK\LinkparmacySystem\node_modules@pmmmwh\react-refresh-webpack-plugin\client\utils\safeThis.js
  • C:\Users\user\Desktop\projects\LINK\LinkparmacySystem\node_modules\react-scripts\node_modules\babel-loader\lib\index.js??ref--5-oneOf-3!C:\Users\user\desktop\projects\LINK\linkparmacysystem\node_modules\webpack\buildin\global.js Used by 1 module(s), i. e. C:\Users\user\Desktop\projects\LINK\LinkparmacySystem\node_modules\react-scripts\node_modules\babel-loader\lib\index.js??ref--5-oneOf-3!C:\Users\user\desktop\projects\LINK\linkparmacysystem\node_modules\mini-create-react-context\dist\esm\index.js

How do i please solve this error, because its making my console dirty when working, i would love a clean console. somebody help, Thank you from Zambia.

Solution

  • This seems to be an issue with node-modules being imported using different casings (for example import React from "react" in one file, and import react from "react" in another).

    However, these files seem to be in the node modules you're using. The error seems to be in either the react-refresh-webpack-plugin module or the mini-create-react-context. There isn't really anything you can do to fix this except removing the module using the incorrect casing, or adding a pull-request on that dependencies repository to correct it.

    You can however attempt to suppress the warning in your module.exports.

    module.exports = {
...
stats: {
    warnings: false
}

    It is not generally recommended to suppress warnings instead of dealing with them, in this case there's no way for you to deal with the issue without looking into the actual dependencies you're using.