Create React App

If you are using create-react-app version >= 5 you may run into polyfill issues. It can be resolved following the instructions below:


  • Install react-app-rewired and the missing modules into your application

  • Install other packages:

yarn add --dev stream-browserify buffer crypto-browserify process os-browserify path-browserify constants-browserify
  • Create config-overrides.js in the root of your project folder with the content

const { ProvidePlugin }= require("webpack")

module.exports = {
  webpack: function (config, env) {
    config.module.rules = => {
      if (rule.oneOf instanceof Array) {
        rule.oneOf[rule.oneOf.length - 1].exclude = [/\.(js|mjs|jsx|cjs|ts|tsx)$/, /\.html$/, /\.json$/];
      return rule;
    config.resolve.fallback = {
      stream: require.resolve("stream-browserify"),
      buffer: require.resolve("buffer"),
      crypto: require.resolve("crypto-browserify"),
      process: require.resolve("process"),
      os: require.resolve("os-browserify"),
      path: require.resolve("path-browserify"),
      constants: require.resolve("constants-browserify"), 
      fs: false
    config.resolve.extensions = [...config.resolve.extensions, ".ts", ".js"]
    config.plugins = [
      new ProvidePlugin({
        Buffer: ["buffer", "Buffer"],
      new ProvidePlugin({
          process: ["process"]
    config.ignoreWarnings = [/Failed to parse source map/];
    return config;
  • Within package.json change the scripts field for start, build and test. Instead of react-scripts replace it with react-app-rewired

"scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"

The missing Nodejs polyfills should be included now and your app should be functional with web3.

If you're using craco, similar changes need to be made to craco.config.js

Last updated