skip to Main Content

I’m relatively new to web development, but I’m working on a React project where I’m trying to interface with an AWS database. To install MySql, I ran npm install mysql, which did end up importing the module, however I now get the error:

Module not found: Error: Can't resolve 'crypto' in '.node_modulesmysqllib' BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default. This is no longer the case. Verify if you need this module and configure a polyfill for it.

I’ve done a lot of reading about Webpack, and I now understand that I just need to add a fallback, presumably in a new file called webpack.config.js in the root folder. However, I made it and the error is still there. Here’s the exact code I used in the file:

module.exports = 
{
    entry:"/src/out.js",

    output:{
        path : "dist",
        filename: "bundle.js"
    },

    resolve: {
        fallback: {
          "fs": false,
          "tls": false,
          "net": false,
          "path": false,
          "zlib": false,
          "http": false,
          "https": false,
          "stream": false,
          "crypto": false,
          "crypto-browserify": false,
          "timers":false
        } 
      },
}

What am I doing wrong? It seems like Webpack is completely ignoring the config file, is it an issue with how I wrote the config file?

If it helps at all, I haven’t changed any of the configurations bar installing the MySql module, and to export/compile I just use the npm start command, which runs it to a localhost.

2

Answers


  1. Chosen as BEST ANSWER

    I figured it out - for anyone with the same problem, this is what I did.

    When you use create-react-app to make the app, it doesn't automatically recognize webpack.config.js, so you need to run npm install react-app-rewired and create another override file called config-override.js. Full instructions and files found here


  2. Re-add support for Node.js core modules with node-polyfill-webpack-plugin:

    And install dependency npm install crypto-browserify and npm install util

    With the package installed, add the following to your webpack.config.js:

    const NodePolyfillPlugin = require("node-polyfill-webpack-plugin")
    
    module.exports = {
        resolve: {
          fallback: {
            // other fallbacks
             "util": require.resolve("util/"),
             "crypto": require.resolve("crypto-browserify")
          },
        }
        // Other rules...
        plugins: [
            new NodePolyfillPlugin()
        ]
    }
    
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search