8

I get this error after installing and importing axios in my react project, any help?:

Compiled with problems:

ERROR in ./node_modules/axios/lib/adapters/http.js 11:11-26

Module not found: Error: Can't resolve 'http' in 'H:\Github\arshwy\reactjs-laravel-simple-dashboard\frontend-react\node_modules\axios\lib\adapters' Did you mean './http'? Requests that should resolve in the current directory need to start with './'. Requests that start with a name are treated as module requests and resolve within module directories (node_modules, H:\Github\arshwy\reactjs-laravel-simple-dashboard\frontend-react\node_modules). If changing the source code is not an option there is also a resolve options called 'preferRelative' which tries to resolve these kind of requests in the current directory too.

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 }

ERROR in ./node_modules/axios/lib/adapters/http.js 13:12-28

Module not found: Error: Can't resolve 'https' in 'H:\Github\arshwy\reactjs-laravel-simple-dashboard\frontend-react\node_modules\axios\lib\adapters'

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/axios/lib/adapters/http.js 19:10-24

Module not found: Error: Can't resolve 'url' in 'H:\Github\arshwy\reactjs-laravel-simple-dashboard\frontend-react\node_modules\axios\lib\adapters'

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: { "url": require.resolve("url/") }' - install 'url' If you don't want to include a polyfill, you can use an empty module like this: resolve.fallback: { "url": false }

ERROR in ./node_modules/axios/lib/adapters/http.js 21:11-26

Module not found: Error: Can't resolve 'zlib' in 'H:\Github\arshwy\reactjs-laravel-simple-dashboard\frontend-react\node_modules\axios\lib\adapters'

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: { "zlib": require.resolve("browserify-zlib") }' - install 'browserify-zlib' If you don't want to include a polyfill, you can use an empty module like this: resolve.fallback: { "zlib": false }

ERROR in ./node_modules/follow-redirects/index.js 1:10-24

Module not found: Error: Can't resolve 'url' in 'H:\Github\arshwy\reactjs-laravel-simple-dashboard\frontend-react\node_modules\follow-redirects'

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: { "url": require.resolve("url/") }' - install 'url' If you don't want to include a polyfill, you can use an empty module like this: resolve.fallback: { "url": false }

ERROR in ./node_modules/follow-redirects/index.js 5:11-26

Module not found: Error: Can't resolve 'http' in 'H:\Github\arshwy\reactjs-laravel-simple-dashboard\frontend-react\node_modules\follow-redirects' Did you mean './http'? Requests that should resolve in the current directory need to start with './'. Requests that start with a name are treated as module requests and resolve within module directories (node_modules, H:\Github\arshwy\reactjs-laravel-simple-dashboard\frontend-react\node_modules). If changing the source code is not an option there is also a resolve options called 'preferRelative' which tries to resolve these kind of requests in the current directory too.

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 }

ERROR in ./node_modules/follow-redirects/index.js 7:12-28

Module not found: Error: Can't resolve 'https' in 'H:\Github\arshwy\reactjs-laravel-simple-dashboard\frontend-react\node_modules\follow-redirects' Did you mean './https'? Requests that should resolve in the current directory need to start with './'. Requests that start with a name are treated as module requests and resolve within module directories (node_modules, H:\Github\arshwy\reactjs-laravel-simple-dashboard\frontend-react\node_modules). If changing the source code is not an option there is also a resolve options called 'preferRelative' which tries to resolve these kind of requests in the current directory too.

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/follow-redirects/index.js 9:15-41

Module not found: Error: Can't resolve 'stream' in 'H:\Github\arshwy\reactjs-laravel-simple-dashboard\frontend-react\node_modules\follow-redirects'

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: { "stream": require.resolve("stream-browserify") }' - install 'stream-browserify' If you don't want to include a polyfill, you can use an empty module like this: resolve.fallback: { "stream": false }

ERROR in ./node_modules/follow-redirects/index.js 11:13-30

Module not found: Error: Can't resolve 'assert' in 'H:\Github\arshwy\reactjs-laravel-simple-dashboard\frontend-react\node_modules\follow-redirects'

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: { "assert": require.resolve("assert/") }' - install 'assert' If you don't want to include a polyfill, you can use an empty module like this: resolve.fallback: { "assert": false }

4
  • 1
    This is not the full error message. Commented Mar 23, 2022 at 16:40
  • 2
    Please clarify your specific problem or provide additional details to highlight exactly what you need. As it's currently written, it's hard to tell exactly what you're asking. Commented Mar 23, 2022 at 16:43
  • @tkausl , thank you i edited and put all my screen error. Commented Mar 23, 2022 at 16:43
  • @Astro Now it's too much 😅 Commented Sep 9, 2022 at 1:51

6 Answers 6

8

I solved my Errors through

npm audit fix --force
Sign up to request clarification or add additional context in comments.

Comments

2

i solved my this error by running this command

npm i url

Comments

2

I solved this issue by these following steps:

  1. According to the error, install the package stream-http using npm i stream-http
  2. Use npm i then npm audit fix --force
  3. Use npm run eject to eject the project
  4. Find the file ./config/webpack.config.js
  5. Add fallback in the resolve config, and configure it { "http": require.resolve("stream-http") }

Now webpack.config.js looks like this:

// a lot of consts and imports (requires)
// ...
module.exports = function (webpackEnv) {
  // a lot of configs
  // ...
  resolve: {
    // ...
    fallback: {
      http: require.resolve("stream-http") // that is this
    }
  }
}

Comments

1

Webpack 5 no longer includes node shims by default, thus we must opt-in to all shims we want. We'll need to add a few dependencies to our project to accomplish this:

yarn add process browserify-zlib stream-browserify util buffer assert

after the installation, modify your webpack.config file as given below

const webpack = require("webpack");

module.exports = {
  /* ... */

  resolve: {
    fallback: {
      http : require.resolve("stream-http"),
      https : require.resolve("https-browserify"),
      url  : require.resolve("url"),
      process: require.resolve("process/browser"),
      zlib: require.resolve("browserify-zlib"),
      stream: require.resolve("stream-browserify"),
      util: require.resolve("util"),
      buffer: require.resolve("buffer"),
      asset: require.resolve("assert"),
    }
  },
  plugins: [
    new webpack.ProvidePlugin({
      Buffer: ["buffer", "Buffer"],
      process: "process/browser",
    }),
  ]

  /* ... */
}

Comments

1

version 0.27 [the latest] not works with me so I removed it and installed prev version like this: "axios": "^0.21.1" It works well with me

Comments

1

Try delete import {response} from "express"

Maybe you don't want to use response from express.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.