1

While trying to connect a react frontend, which was just created using create-react-app, I got this error message when running npm run start after importing pact-lang-api to the app:

ERROR in ./node_modules/eventsource/lib/eventsource.js 5:12-28 Module not found: Error: Can't resolve 'https' in '/src/node_modules/eventsource/lib'

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.

If you want to include a polyfill, you need to:
add a fallback 'resolve.fallback: { "https": require.resolve("https-browserify") }'
install 'https-browserify' 

If you don't want to include a polyfill, you can use an empty module like this: resolve.fallback: { "https": false }

ERROR in ./node_modules/eventsource/lib/eventsource.js 7:11-26 Module not found: Error: Can't resolve 'http' in '/src/node_modules/eventsource/lib'

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.

If you want to include a polyfill, you need to:
add a fallback 'resolve.fallback: { "http": require.resolve("stream-http") }'
install 'stream-http' 

If you don't want to include a polyfill, you can use an empty module like this: resolve.fallback: { "http": false }

webpack compiled with 2 errors and 2 warnings

My dependencies look like this:

{
    "@emotion/react": "^11.9.0",
    "@emotion/styled": "^11.8.1",
    "@mui/material": "^5.8.3",
    "@testing-library/jest-dom": "^5.16.4",
    "@testing-library/react": "^13.3.0",
    "@testing-library/user-event": "^13.5.0",
    "pact-lang-api": "^4.3.3",
    "react": "^18.1.0",
    "react-dom": "^18.1.0",
    "react-scripts": "4.0.3",
    "web-vitals": "^2.1.4"
  }

How would I work through this? Thanks in advance for any help!

mike sutanto
  • 58
  • 4

2 Answers2

0

The error says to install stream-http and https-browserify.

Try

npm i stream-http https-browserify
georgep
  • 731
  • 1
  • 12
0

Just fixed this issue myself by following along with the solution at https://alchemy.com/blog/how-to-polyfill-node-core-modules-in-webpack-5.

Note that the article is targeted at fixing this issue created by web3.js package, not pact-lang-api. For pact-lang-api, you will also need to add the url and util packages so your final config-overrides file will look like...

const webpack = require("webpack");
module.exports = function override(config) {
  const fallback = config.resolve.fallback || {};
  Object.assign(fallback, {
    crypto: require.resolve("crypto-browserify"),
    stream: require.resolve("stream-browserify"),
    assert: require.resolve("assert"),
    http: require.resolve("stream-http"),
    https: require.resolve("https-browserify"),
    os: require.resolve("os-browserify"),
    url: require.resolve("url"),
    util: require.resolve("util"),
  });
  config.resolve.fallback = fallback;
  config.plugins = (config.plugins || []).concat([
    new webpack.ProvidePlugin({
      process: "process/browser",
      Buffer: ["buffer", "Buffer"],
    }),
  ]);
  return config;
};

The solution in the article does not include url: require.resolve("url") or util: require.resolve("util"), but you will need both.

Kev-O
  • 11
  • 1