Close to working with TypeScript, but not quite -- Error: "Cannot find name RequestInit" about graphql-request

[schickling]

Can you try adding dom to your libs array?

Example:

{
  "compilerOptions": {
    "target": "es5",
    "moduleResolution": "node",
    "module": "commonjs",
    "sourceMap": true,
    "noUnusedLocals": true,
    "rootDir": "src",
    "outDir": "dist",
    "lib": [
      "dom"
    ]
  }
}

[ngocdaothanh]

For completeness, there are other errors:

node_modules/graphql-request/dist/src/index.d.ts:11:18 - error TS2304: Cannot find name 'Headers'.

11         headers: Headers;
                    ~~~~~~~

node_modules/graphql-request/dist/src/index.d.ts:22:14 - error TS2304: Cannot find name 'Headers'.

22     headers: Headers;
                ~~~~~~~

node_modules/graphql-request/dist/src/types.d.ts:8:14 - error TS2304: Cannot find name 'RequestInit'.

8     method?: RequestInit['method'];
               ~~~~~~~~~~~

node_modules/graphql-request/dist/src/types.d.ts:10:12 - error TS2304: Cannot find name 'RequestInit'.

10     mode?: RequestInit['mode'];
              ~~~~~~~~~~~

node_modules/graphql-request/dist/src/types.d.ts:11:19 - error TS2304: Cannot find name 'RequestInit'.

11     credentials?: RequestInit['credentials'];
                     ~~~~~~~~~~~

node_modules/graphql-request/dist/src/types.d.ts:12:13 - error TS2304: Cannot find name 'RequestInit'.

12     cache?: RequestInit['cache'];
               ~~~~~~~~~~~

node_modules/graphql-request/dist/src/types.d.ts:13:16 - error TS2304: Cannot find name 'RequestInit'.

13     redirect?: RequestInit['redirect'];
                  ~~~~~~~~~~~

node_modules/graphql-request/dist/src/types.d.ts:14:16 - error TS2304: Cannot find name 'RequestInit'.

14     referrer?: RequestInit['referrer'];
                  ~~~~~~~~~~~

node_modules/graphql-request/dist/src/types.d.ts:15:22 - error TS2304: Cannot find name 'RequestInit'.

15     referrerPolicy?: RequestInit['referrerPolicy'];
                        ~~~~~~~~~~~

node_modules/graphql-request/dist/src/types.d.ts:16:17 - error TS2304: Cannot find name 'RequestInit'.

16     integrity?: RequestInit['integrity'];
                   ~~~~~~~~~~~


Found 10 errors.

[lednhatkhanh]

You should not include a dom lib to an api project, it may leads to some weird behaviors.

fetch is normally a DOM-only API -- this package appears to have an API similar to fetch, but not the same. It's used like:

export interface Options {
    method?: RequestInit['method'];
    headers?: Headers;
    mode?: RequestInit['mode'];
    credentials?: RequestInit['credentials'];
    cache?: RequestInit['cache'];
    redirect?: RequestInit['redirect'];
    referrer?: RequestInit['referrer'];
    referrerPolicy?: RequestInit['referrerPolicy'];
    integrity?: RequestInit['integrity'];
}

Maybe the best solution would be to just copy the relevant parts instead of referencing RequestInit. There's also microsoft/TypeScript#15780 which would allow you to pull in dom typings without users needing to modify tsconfig.json, but that then adds a bunch of globals that they might not need.

[kallaspriit]

Why was this closed? I'm using graphql-request for testing graphql with Jest in a nodejs API application and I don't really want to include dom as lib in tsconfig.json.

[brikou]

One quick workaround is to update tsconfig.json:

{
    "compilerOptions": {
        "skipLibCheck": true,
    }
}

I believe your TS compilation will also be faster.

[schmod]

Can a maintainer please look at one of the two PRs open that addresses this issue?

[kbrandwijk]

Unable to reproduce in the current version.

[maxdarque]

I get this in when I run tsc on "graphql-request": "^1.4.0",

[maxdarque]

@schickling thanks that works

[schickling]

@lednhatkhanh while I haven't seen any issues with this yet, do you have any other suggestions? Using fetch in TypeScript is definitely weird in general in regards to type definitions.

cc @andy-ms @RyanCavanaugh

[divyenduz]

With the latest version - 1.7.0 I ran only into error TS2304: Cannot find name 'AsyncIterable'. in node_modules/@types/graphql/subscription/subscribe.d.ts

[maxdarque]

@divyenduz are you including esnext.asynciterable under the tsconfig.json lib option?

{
  "compilerOptions": {
    "target": "es2017",
    "lib": [ "es2017", "dom", "esnext.asynciterable" ],
    "moduleResolution": "node",
    "module": "commonjs",
    "sourceMap": true,
    "rootDirs": ["src", "stress-tests"],
    "outDir": "dist",
    "removeComments": true,
    "strictNullChecks": false,
    "noUnusedLocals": false,
    "noUnusedParameters": false
  }
}

[divyenduz]

Nope, to test this out I used the following (empty) tsconfig.json

{}

[maxdarque]

I don't quite follow. So have you tried adding esnext.asynciterable to the tsconfig.json lib option?

[divyenduz]

Ah! got it now, yes it works with esnext.asynciterable. The idea was to make it work without any additions to tsconfig.json but this won't be possible for AsyncIterable because the dep is in graphql-js. Thanks!

[divyenduz]

@kallaspriit : Thanks for the feedback, reopened. Do you suggest that we extract the required parts from dom lib into the source code itself? Can you come up with a PR for this to see how that looks like? Thanks!

[kallaspriit]

I gave it a go and managed to remove the dom lib dependency by including the required types along with the library. Can't also use the @types/fetch-mock as it depends on dom lib as well.

Hope it helps :)

[schickling]

🎉 This issue has been resolved in version 2.0.0 🎉

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot 📦🚀

[jasonkuhrt]

Unfortunately this issue is not resolved yet.

If the consumer sets their compilerOptions.lib property and it doesn't include dom then this issue will occur.

[jasonkuhrt]

I just tried a solution based on the types given by @kallaspriit in #100 and that is working ok.

[MarkLyck]

I'm having this issue on version 3.3.0

running in a node environment where I have no possibility to change the tsconfig file, so the 2 suggested solutions are not possible.

[jasonkuhrt]

@MarkLyck can you share exactly what your issue is? This is a long and old thread.

[MarkLyck]

@jasonkuhrt same error as the author: "Cannot find name RequestInit"

I'm running this in a node environment (there is no "Dom") and I don't have control over the tsconfig. So I cannot set typescript to ignore lib or add the Dom to it.

Looking at the index.d.ts it is directly referencing Dom types, which don't exist in Node. So the errors make sense, but I can't "work around it" like the suggested solutions as I don't have control over the exact modules or typescript configuration.

[jasonkuhrt]

@MarkLyck What version of lib the are you using? The Dom imports you see are inlined and not actually the relying on the global environment.