Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Typescript error: Cannot find name 'Buffer'/'http'/'https' #1271

Closed
remimarenco opened this issue Dec 15, 2016 · 36 comments
Closed

Typescript error: Cannot find name 'Buffer'/'http'/'https' #1271

remimarenco opened this issue Dec 15, 2016 · 36 comments

Comments

@remimarenco
Copy link

@remimarenco remimarenco commented Dec 15, 2016

Hi!

First, I want to thank you for this SDK, it will be very useful for us!

I have some errors when building the javascript bundle for my application (React/Typescript/Webpack). It seems to work anyway (or maybe I have not used it enough yet), but I am not comfortable building our app with errors :).

Here is an extract of the errors:

Hash: 6824b5df64cd8f5d85c3
Version: webpack 1.14.0
Time: 4139ms
          Asset     Size  Chunks             Chunk Names
    frontend.js  3.63 MB       0  [emitted]  main
frontend.js.map  5.28 MB       0  [emitted]  main
    + 617 hidden modules

ERROR in /Users/rmarenco/Dev/taiga/frontend/node_modules/aws-sdk/clients/wafregional.d.ts
(416,39): error TS2304: Cannot find name 'Buffer'.

...

ERROR in /Users/rmarenco/Dev/taiga/frontend/node_modules/aws-sdk/lib/config.d.ts
(1,34): error TS2307: Cannot find module 'http'.

ERROR in /Users/rmarenco/Dev/taiga/frontend/node_modules/aws-sdk/lib/config.d.ts
(2,35): error TS2307: Cannot find module 'https'.

And you can find the full errors on this gist => https://gist.github.com/remimarenco/c51c3170fbfd8d548e6fd2fe4542cdb1

I am also including my configuration files in the gist, in case they could be useful :). The architecture of my application is like this:

taiga/

  • frontend/
    • node_modules/ <= All my frontend dependencies
    • src/ <= All my .tsx
    • package.json
  • node_modules/ <= All my backend and dev dependencies
  • taiga2/
    • static/ <= Folder where webpack store the outputs
  • package.json
  • tsconfig.json
  • webpack.config.js

Do you think you know what is not correct in my configuration? Or is it on the sdk side + webpack (and/or typescript)?

Thanks a lot!

@chrisradek
Copy link
Contributor

@chrisradek chrisradek commented Dec 15, 2016

@remimarenco
TypeScript is complaining because some node environment types are needed. This is a limitation for now that we might be able to get around by stubbing those interfaces in the future.

I admit it's odd to have to include node typings for a front-end project, but can you try installing the environment typings to see if it gets around your issue?
npm install --save-dev @types/node

@remimarenco
Copy link
Author

@remimarenco remimarenco commented Dec 15, 2016

@chrisradek Thanks for you swift reply!

I came across this recommendation on different websites, but unfortunately it does not change anything :/.

Should I also include @types/aws-sdk? I had some issues with it that is why I did not add it yet.

@chrisradek
Copy link
Contributor

@chrisradek chrisradek commented Dec 16, 2016

I found a work-around, I have to dig deeper to see if the issue is related to just ts-loader or not.

In your tsconfig.json file, you can add "types": ["node"] as one of your compilerOptions. Then, also make sure to install @types/node at the same level as your tsconfig.json file. If I followed your gist correctly, that would be your top-level package.json, the one that's a sibling of your tsconfig.json file.

@remimarenco
Copy link
Author

@remimarenco remimarenco commented Dec 23, 2016

Hi @chrisradek!

A bit of feedback since I have followed your advice:

  • I definitely need to add the "types": ["node"] + @types/node if I have ts-loader
  • I only need to add @types/node if I have awesome-typescript-loader

Thanks again!

@pvamshi
Copy link

@pvamshi pvamshi commented Apr 3, 2017

I have same problem. I am using angular-cli stable with Angular 4.
I added "types":["node"], but the problem still exists.
Any help is appreciated.

@chrisradek
Copy link
Contributor

@chrisradek chrisradek commented Apr 3, 2017

@pvamshi
Can you share what your config files look like? If you can provide a gist that would be helpful. These sorts of issues are hard to troubleshoot since they appear differently based on how a project is set up.

@pvamshi
Copy link

@pvamshi pvamshi commented Apr 3, 2017

@chrisradek Sure. Here is my config . It's exactly what we get with cli except for the above mentioned line. Thanks in advance.

{
  "compileOnSave": false,
  "compilerOptions": {
    "outDir": "./dist/out-tsc",
    "baseUrl": "src",
    "sourceMap": true,
    "declaration": false,
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "target": "es5",
    "types" : ["node"],
    "typeRoots": [
      "node_modules/@types"
    ],
    "lib": [
      "es2016",
      "dom"
    ]
  }
}

Edit: package.json gist : https://gist.github.com/pvamshi/a2cb2c5bca99fe285ebddcabbb5f56f2

@chrisradek
Copy link
Contributor

@chrisradek chrisradek commented Apr 4, 2017

@pvamshi
Is your package.json file an accurate representation of your dependencies? I noticed the aws-sdk isn't listed.

@chrisradek
Copy link
Contributor

@chrisradek chrisradek commented Apr 4, 2017

@pvamshi
So, I was able to reproduce your issue. You actually need to add "types": ["node"] to the tsconfig.app.json file that the angular-cli creates in the src directory. By default, types is an empty array.

Based on these TypeScript docs:

Specify "types": [] to disable automatic inclusion of @types packages.

Since types is empty, it is excluding the node typings that you installed via npm install @types/node.

@pvamshi
Copy link

@pvamshi pvamshi commented Apr 8, 2017

This worked , thanks a lot .

@mattroberts297
Copy link

@mattroberts297 mattroberts297 commented Apr 25, 2017

I had the same issue as @pvamshi. @chrisradek's solution tsconfig.app.json worked for me, but because that file extends ../tsconfig.json you can also just delete "types": ["node"] if you followed his previous instructions re: tsconfig.json. Thanks for all your hard work troubleshooting this.

1nvcp6

@jeskew jeskew added typings and removed Question labels May 4, 2017
@webcat12345
Copy link

@webcat12345 webcat12345 commented Jul 25, 2017

It works for me, thanks a lot

@huangzhenhong
Copy link

@huangzhenhong huangzhenhong commented Aug 4, 2017

Updated tsconfig.app.json inside src folder, it works for me, thanks!

{
  "extends": "../tsconfig.json",
  "compilerOptions": {
    "outDir": "../out-tsc/app",
    "module": "es2015",
    "baseUrl": "",
    "types": ["node"]
  },
  "exclude": [
    "test.ts",
    "**/*.spec.ts"
  ]
}

@dpiechota
Copy link

@dpiechota dpiechota commented Aug 6, 2017

I also had to add

"typeRoots": [
      "../node_modules/@types"
    ]

@tango2310
Copy link

@tango2310 tango2310 commented Aug 8, 2017

Thanks so much @chrisradek That worked for me

@jeskew
Copy link
Contributor

@jeskew jeskew commented Aug 8, 2017

Based on the last comments, it sounds like this issue is resolved: there are some Angular-specific hurdles to using the dependent @types/node module, but with appropriate configuration everything works as expected.

Please let me know if I'm mistaken and there's something more the SDK should be doing here.

@AppField
Copy link

@AppField AppField commented Aug 11, 2017

I've just had the same issue within an angular 4.3.3 project.
After installing @types/node and adding "node" to tsconfig.app.json the error is gone.

@RafPe
Copy link

@RafPe RafPe commented Aug 30, 2017

I confirm this has worked out and was managed to run the code!

@jasbro-qut
Copy link

@jasbro-qut jasbro-qut commented Sep 2, 2017

This worked for me as well. May I suggest, you could add this as an official step to take in the README.md. Based on the feedback here, it seems to help anyone adding aws-sdk to an angular-cli based project.

@danieladams456
Copy link

@danieladams456 danieladams456 commented Sep 11, 2017

I was able to make it work by taking out the types key in tsconfig.app.json. Putting back in the empty list made it fail again, so it seems like the non-existence of that key also will fix the issue.

{
  "extends": "../tsconfig.json",
  "compilerOptions": {
    "outDir": "../out-tsc/app",
    "baseUrl": "./",
    "module": "es2015"
  },
  "exclude": [
    "test.ts",
    "**/*.spec.ts"
  ]
}

@gambheera88
Copy link

@gambheera88 gambheera88 commented Sep 21, 2017

Worked for me the solution...! thanks

@lokeshkanagala
Copy link

@lokeshkanagala lokeshkanagala commented Sep 24, 2017

After changing tsconfig.app.json, it worked for me. Changing tsconfig.json hasn't solved this issue.

@ghost
Copy link

@ghost ghost commented Oct 7, 2017

After changing tsconfig.app.json, it worked for me. Changing tsconfig.json hasn't solved this issue. [2]

@ghost
Copy link

@ghost ghost commented Oct 18, 2017

@danieladams456 solution worked for me. Seems like a bug in the SDK...

@ghost
Copy link

@ghost ghost commented Oct 23, 2017

Link for those coming here after the fact: https://github.com/aws/aws-sdk-js#with-angular

@dudunato
Copy link

@dudunato dudunato commented Feb 11, 2018

Hey there, I'm adding the types to my tsconfig.json then it gives me another error:

node_modules/@types/react-native/index.d.ts(8630,14): error TS2300: Duplicate identifier 'require'.
node_modules/@types/node/index.d.ts(140,13): error TS2300: Duplicate identifier 'require'.

Here's my tsconfig.json:

{
  "compilerOptions": {
    "target": "es2015",
    "module": "es2015",
    "moduleResolution": "node",
    "jsx": "react",
    "outDir": "compiled",
    "rootDir": "./src",
    "types": ["node", "react", "react-native", "jest"]
  },
  "include": ["./src/**/*"],
  "exclude": [
    "./compiled",
    "./node_modules"
  ]
}

It seems that node types are conflicting with react-native. Any thoughts?

cc @chrisradek

@jbownzino
Copy link

@jbownzino jbownzino commented Mar 12, 2018

thank you @chrisradek!

@SagarMhatre
Copy link

@SagarMhatre SagarMhatre commented Mar 18, 2018

thank you @chrisradek!

@brunolm
Copy link

@brunolm brunolm commented Mar 23, 2018

It doesn't make any sense, but on Ionic you have to add this, even if it doesn't make sense. under compiler options

    "typeRoots": [
      "node_modules/@types"
    ]

@MissAnichka
Copy link

@MissAnichka MissAnichka commented Mar 23, 2018

Found this while having the same/similar issues implementing awsmobile-cli and aws-amplify with angular5. Was receiving many webpack errors, followed the solutions in this order which solved my problem:

  1. In tsconfig.json added: "allowJs": true in the “compilerOptions”
  2. npm installed stream
  3. In tsconfig.app.json added “node” to “types” array in “compilerOptions”
    Webpack compiled successfully!
    Thank you very much for the solutions 💯 🥇 👍

@Jun711
Copy link

@Jun711 Jun711 commented Mar 29, 2018

Hi @MissAnichka, did you have this error message:
ERROR in /Users/j/Projects/commercial/node_modules/aws-amplify/lib/PubSub/Providers/MqttOverWSProvider.d.ts (1,23): Cannot find type definition file for 'paho-mqtt'.

EDIT: fix is
npm i –save-dev @types/zen-observable
npm i –save-dev @types/paho-mqtt

@p-sebastian
Copy link

@p-sebastian p-sebastian commented Apr 27, 2018

For anybody using the ionic framework, and wanting to use the aws-sdk with typings. Its a bit different than what explained above:

  • npm install --save-dev @types/node
  • copy ./node_modules/@types/node/index.d.ts ; to ./src/providers
  • npm uninstall --save-dev @types/node

then you should be able to build
if you still get errors, go into the typings file you just copied and clear the errors, there should be a reference import on line 30, that you can comment out, and on line 2381: class URL says its duplicate, just rename it, and URLSearchParams below.

@jayeshkorat18
Copy link

@jayeshkorat18 jayeshkorat18 commented Jun 10, 2018

Thanks @chrisradek
Your solution work for me. Thanks again.

@dreadnautxbuddha
Copy link

@dreadnautxbuddha dreadnautxbuddha commented Dec 11, 2018

Updated tsconfig.app.json inside src folder, it works for me, thanks!

{
  "extends": "../tsconfig.json",
  "compilerOptions": {
    "outDir": "../out-tsc/app",
    "module": "es2015",
    "baseUrl": "",
    "types": ["node"]
  },
  "exclude": [
    "test.ts",
    "**/*.spec.ts"
  ]
}

This fixed it for me. Thanks @huangzhenhong !

@affanshahab
Copy link

@affanshahab affanshahab commented Dec 31, 2018

Hello @chrisradek, thanks for the sdk and your replies on this thread.
We have been using aws-sdk (version: 2.177.0) in an angular 4 project for an year now and it never complained and one day out of no where it started to give error as mentioned in this ticket. Our project was working fine locally but it started to get failed in AWS-CodeBuild. We googled and followed steps in this thread and the error was gone. Before trying this we even tried to use the latest sdk, it didn't work. Removing sdk at all also worked. Anyway we added "types":["node"] and it started to work but we need to know the root cause what could be the reason it stopped working out of no where? Thanks for your efforts.

@lock
Copy link

@lock lock bot commented Sep 29, 2019

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs and link to relevant comments in this thread.

@lock lock bot locked as resolved and limited conversation to collaborators Sep 29, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Linked pull requests

Successfully merging a pull request may close this issue.