Installation twitter-api-client

[jesusdra]

I have installed the library in my vue 3 project, when importing it I get the following errors:

" ERROR Failed to compile with 5 errors 12:32:51

error in ./node_modules/oauth/lib/oauth.js

Module not found: Error: Can't resolve 'crypto' in 'C:\projectJorge\project-jorge\node_modules\oauth\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: { "crypto": require.resolve("crypto-browserify") }'
- install 'crypto-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
resolve.fallback: { "crypto": false }

error in ./node_modules/oauth/lib/oauth.js

Module not found: Error: Can't resolve 'http' in 'C:\projectJorge\project-jorge\node_modules\oauth\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 }

error in ./node_modules/oauth/lib/oauth.js

Module not found: Error: Can't resolve 'https' in 'C:\projectJorge\project-jorge\node_modules\oauth\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/oauth/lib/oauth.js

Module not found: Error: Can't resolve 'url' in 'C:\projectJorge\project-jorge\node_modules\oauth\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: { "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/oauth/lib/oauth.js

Module not found: Error: Can't resolve 'querystring' in 'C:\projectJorge\project-jorge\node_modules\oauth\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: { "querystring": require.resolve("querystring-es3") }'
- install 'querystring-es3'
If you don't want to include a polyfill, you can use an empty module like this:
resolve.fallback: { "querystring": false }

ERROR in ./node_modules/oauth/lib/oauth.js 3:13-30
Module not found: Error: Can't resolve 'crypto' in 'C:\projectJorge\project-jorge\node_modules\oauth\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: { "crypto": require.resolve("crypto-browserify") }'
- install 'crypto-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
resolve.fallback: { "crypto": false }
@ ./node_modules/oauth/index.js 1:0-44 2:0-52
@ ./node_modules/twitter-api-client/dist/base/Transport.js 169:30-46
@ ./node_modules/twitter-api-client/dist/index.js 16:34-61
@ ./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[0]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/components/HelloWorld.vue?vue&type=script&lang=js 3:0-51 41:32-45
@ ./src/components/HelloWorld.vue?vue&type=script&lang=js 1:0-202 1:0-202 1:203-394 1:203-394
@ ./src/components/HelloWorld.vue 2:0-61 3:0-56 3:0-56 8:49-55
@ ./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[0]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/App.vue?vue&type=script&lang=js 1:0-53 5:4-14
@ ./src/App.vue?vue&type=script&lang=js 1:0-189 1:0-189 1:190-368 1:190-368
@ ./src/App.vue 2:0-54 3:0-49 3:0-49 8:49-55
@ ./src/main.js 2:0-28 5:10-13

ERROR in ./node_modules/oauth/lib/oauth.js 5:11-26
Module not found: Error: Can't resolve 'http' in 'C:\projectJorge\project-jorge\node_modules\oauth\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 }
@ ./node_modules/oauth/index.js 1:0-44 2:0-52
@ ./node_modules/twitter-api-client/dist/base/Transport.js 169:30-46
@ ./node_modules/twitter-api-client/dist/index.js 16:34-61
@ ./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[0]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/components/HelloWorld.vue?vue&type=script&lang=js 3:0-51 41:32-45
@ ./src/components/HelloWorld.vue?vue&type=script&lang=js 1:0-202 1:0-202 1:203-394 1:203-394
@ ./src/components/HelloWorld.vue 2:0-61 3:0-56 3:0-56 8:49-55
@ ./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[0]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/App.vue?vue&type=script&lang=js 1:0-53 5:4-14
@ ./src/App.vue?vue&type=script&lang=js 1:0-189 1:0-189 1:190-368 1:190-368
@ ./src/App.vue 2:0-54 3:0-49 3:0-49 8:49-55
@ ./src/main.js 2:0-28 5:10-13

ERROR in ./node_modules/oauth/lib/oauth.js 6:12-28
Module not found: Error: Can't resolve 'https' in 'C:\projectJorge\project-jorge\node_modules\oauth\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 }
@ ./node_modules/oauth/index.js 1:0-44 2:0-52
@ ./node_modules/twitter-api-client/dist/base/Transport.js 169:30-46
@ ./node_modules/twitter-api-client/dist/index.js 16:34-61
@ ./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[0]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/components/HelloWorld.vue?vue&type=script&lang=js 3:0-51 41:32-45
@ ./src/components/HelloWorld.vue?vue&type=script&lang=js 1:0-202 1:0-202 1:203-394 1:203-394
@ ./src/components/HelloWorld.vue 2:0-61 3:0-56 3:0-56 8:49-55
@ ./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[0]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/App.vue?vue&type=script&lang=js 1:0-53 5:4-14
@ ./src/App.vue?vue&type=script&lang=js 1:0-189 1:0-189 1:190-368 1:190-368
@ ./src/App.vue 2:0-54 3:0-49 3:0-49 8:49-55
@ ./src/main.js 2:0-28 5:10-13

ERROR in ./node_modules/oauth/lib/oauth.js 7:10-24
Module not found: Error: Can't resolve 'url' in 'C:\projectJorge\project-jorge\node_modules\oauth\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: { "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 }
@ ./node_modules/oauth/index.js 1:0-44 2:0-52
@ ./node_modules/twitter-api-client/dist/base/Transport.js 169:30-46
@ ./node_modules/twitter-api-client/dist/index.js 16:34-61
@ ./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[0]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/components/HelloWorld.vue?vue&type=script&lang=js 3:0-51 41:32-45
@ ./src/components/HelloWorld.vue?vue&type=script&lang=js 1:0-202 1:0-202 1:203-394 1:203-394
@ ./src/components/HelloWorld.vue 2:0-61 3:0-56 3:0-56 8:49-55
@ ./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[0]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/App.vue?vue&type=script&lang=js 1:0-53 5:4-14
@ ./src/App.vue?vue&type=script&lang=js 1:0-189 1:0-189 1:190-368 1:190-368
@ ./src/App.vue 2:0-54 3:0-49 3:0-49 8:49-55
@ ./src/main.js 2:0-28 5:10-13

ERROR in ./node_modules/oauth/lib/oauth.js 8:18-40
Module not found: Error: Can't resolve 'querystring' in 'C:\projectJorge\project-jorge\node_modules\oauth\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: { "querystring": require.resolve("querystring-es3") }'
- install 'querystring-es3'
If you don't want to include a polyfill, you can use an empty module like this:
resolve.fallback: { "querystring": false }
@ ./node_modules/oauth/index.js 1:0-44 2:0-52
@ ./node_modules/twitter-api-client/dist/base/Transport.js 169:30-46
@ ./node_modules/twitter-api-client/dist/index.js 16:34-61
@ ./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[0]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/components/HelloWorld.vue?vue&type=script&lang=js 3:0-51 41:32-45
@ ./src/components/HelloWorld.vue?vue&type=script&lang=js 1:0-202 1:0-202 1:203-394 1:203-394
@ ./src/components/HelloWorld.vue 2:0-61 3:0-56 3:0-56 8:49-55
@ ./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[0]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/App.vue?vue&type=script&lang=js 1:0-53 5:4-14
@ ./src/App.vue?vue&type=script&lang=js 1:0-189 1:0-189 1:190-368 1:190-368
@ ./src/App.vue 2:0-54 3:0-49 3:0-49 8:49-55
@ ./src/main.js 2:0-28 5:10-13

ERROR in ./node_modules/oauth/lib/oauth2.js 1:18-40
Module not found: Error: Can't resolve 'querystring' in 'C:\projectJorge\project-jorge\node_modules\oauth\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: { "querystring": require.resolve("querystring-es3") }'
- install 'querystring-es3'
If you don't want to include a polyfill, you can use an empty module like this:
resolve.fallback: { "querystring": false }
@ ./node_modules/oauth/index.js 3:0-47
@ ./node_modules/twitter-api-client/dist/base/Transport.js 169:30-46
@ ./node_modules/twitter-api-client/dist/index.js 16:34-61
@ ./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[0]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/components/HelloWorld.vue?vue&type=script&lang=js 3:0-51 41:32-45
@ ./src/components/HelloWorld.vue?vue&type=script&lang=js 1:0-202 1:0-202 1:203-394 1:203-394
@ ./src/components/HelloWorld.vue 2:0-61 3:0-56 3:0-56 8:49-55
@ ./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[0]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/App.vue?vue&type=script&lang=js 1:0-53 5:4-14
@ ./src/App.vue?vue&type=script&lang=js 1:0-189 1:0-189 1:190-368 1:190-368
@ ./src/App.vue 2:0-54 3:0-49 3:0-49 8:49-55
@ ./src/main.js 2:0-28 5:10-13

ERROR in ./node_modules/oauth/lib/oauth2.js 2:13-30
Module not found: Error: Can't resolve 'crypto' in 'C:\projectJorge\project-jorge\node_modules\oauth\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: { "crypto": require.resolve("crypto-browserify") }'
- install 'crypto-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
resolve.fallback: { "crypto": false }
@ ./node_modules/oauth/index.js 3:0-47
@ ./node_modules/twitter-api-client/dist/base/Transport.js 169:30-46
@ ./node_modules/twitter-api-client/dist/index.js 16:34-61
@ ./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[0]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/components/HelloWorld.vue?vue&type=script&lang=js 3:0-51 41:32-45
@ ./src/components/HelloWorld.vue?vue&type=script&lang=js 1:0-202 1:0-202 1:203-394 1:203-394
@ ./src/components/HelloWorld.vue 2:0-61 3:0-56 3:0-56 8:49-55
@ ./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[0]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/App.vue?vue&type=script&lang=js 1:0-53 5:4-14
@ ./src/App.vue?vue&type=script&lang=js 1:0-189 1:0-189 1:190-368 1:190-368
@ ./src/App.vue 2:0-54 3:0-49 3:0-49 8:49-55
@ ./src/main.js 2:0-28 5:10-13

ERROR in ./node_modules/oauth/lib/oauth2.js 3:12-28
Module not found: Error: Can't resolve 'https' in 'C:\projectJorge\project-jorge\node_modules\oauth\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 }
@ ./node_modules/oauth/index.js 3:0-47
@ ./node_modules/twitter-api-client/dist/base/Transport.js 169:30-46
@ ./node_modules/twitter-api-client/dist/index.js 16:34-61
@ ./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[0]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/components/HelloWorld.vue?vue&type=script&lang=js 3:0-51 41:32-45
@ ./src/components/HelloWorld.vue?vue&type=script&lang=js 1:0-202 1:0-202 1:203-394 1:203-394
@ ./src/components/HelloWorld.vue 2:0-61 3:0-56 3:0-56 8:49-55
@ ./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[0]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/App.vue?vue&type=script&lang=js 1:0-53 5:4-14
@ ./src/App.vue?vue&type=script&lang=js 1:0-189 1:0-189 1:190-368 1:190-368
@ ./src/App.vue 2:0-54 3:0-49 3:0-49 8:49-55
@ ./src/main.js 2:0-28 5:10-13

ERROR in ./node_modules/oauth/lib/oauth2.js 4:11-26
Module not found: Error: Can't resolve 'http' in 'C:\projectJorge\project-jorge\node_modules\oauth\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 }
@ ./node_modules/oauth/index.js 3:0-47
@ ./node_modules/twitter-api-client/dist/base/Transport.js 169:30-46
@ ./node_modules/twitter-api-client/dist/index.js 16:34-61
@ ./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[0]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/components/HelloWorld.vue?vue&type=script&lang=js 3:0-51 41:32-45
@ ./src/components/HelloWorld.vue?vue&type=script&lang=js 1:0-202 1:0-202 1:203-394 1:203-394
@ ./src/components/HelloWorld.vue 2:0-61 3:0-56 3:0-56 8:49-55
@ ./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[0]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/App.vue?vue&type=script&lang=js 1:0-53 5:4-14
@ ./src/App.vue?vue&type=script&lang=js 1:0-189 1:0-189 1:190-368 1:190-368
@ ./src/App.vue 2:0-54 3:0-49 3:0-49 8:49-55
@ ./src/main.js 2:0-28 5:10-13

ERROR in ./node_modules/oauth/lib/oauth2.js 5:10-24
Module not found: Error: Can't resolve 'url' in 'C:\projectJorge\project-jorge\node_modules\oauth\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: { "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 }
@ ./node_modules/oauth/index.js 3:0-47
@ ./node_modules/twitter-api-client/dist/base/Transport.js 169:30-46
@ ./node_modules/twitter-api-client/dist/index.js 16:34-61
@ ./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[0]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/components/HelloWorld.vue?vue&type=script&lang=js 3:0-51 41:32-45
@ ./src/components/HelloWorld.vue?vue&type=script&lang=js 1:0-202 1:0-202 1:203-394 1:203-394
@ ./src/components/HelloWorld.vue 2:0-61 3:0-56 3:0-56 8:49-55
@ ./node_modules/babel-loader/lib/index.js??clonedRuleSet-40.use[0]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/App.vue?vue&type=script&lang=js 1:0-53 5:4-14
@ ./src/App.vue?vue&type=script&lang=js 1:0-189 1:0-189 1:190-368 1:190-368
@ ./src/App.vue 2:0-54 3:0-49 3:0-49 8:49-55
@ ./src/main.js 2:0-28 5:10-13

webpack compiled with 10 errors"

I don't know exactly the reason for this error, it's driving me crazy and I don't know how to fix it.
Node V: 16.17.0
NPM 8.15.0

[zyhzyh0333]

My react project has the same problem.
Already mad.

[jesusdra]

I have not been able to do that and I have given up.

[zyhzyh0333]

Actually, this problem is due to the webpack, I'm using React, and the version of "react-script" (5.0.0) leads to the problem.
This step can be solved by following this link:
https://stackoverflow.com/questions/73317870/cant-resolve-querystring-in-react

However, after solving this part, there's also another big issue, which is the CROS block.
It seems that Twitter API doesn't allow calling it from the frontend. I'm able to make everything run in my local Node.js, but adding it to React project turns out to be totally different. Even the easiest way, using https request, also failed.

So, one solution might be building a local Node.js server, and connecting it to the react frontend. It's too difficult for me to get it done two days before the ddl, so I'm not sure this will work properly as expected.