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

Add a note to the documentation explaining how to use node-fetch with apollo-link-http #4857

Closed
maecapozzi opened this issue May 23, 2019 · 3 comments

Comments

@maecapozzi
Copy link

The documentation recommends using node-fetch as your data-fetching tool when you are running node. Unfortunately, when you try to use node-fetch in a TypeScript project with apollo-link-http, you see this error:

error TS7016: Could not find a declaration file for module 'node-fetch'. '/Users/mae.capozzi/Desktop/Codes/project/packages/client/node_modules/node-fetch/lib/index.js' implicitly has an 'any' type.
  Try `npm install @types/node-fetch` if it exists or add a new declaration (.d.ts) file containing `declare module 'node-fetch';`

8 import fetch from 'node-fetch';

If you install @types/node-fetch, you see this error:

error TS2345: Argument of type '{ uri: string | undefined; credentials: string; fetch: typeof fetch; }' is not assignable to parameter of type 'Options'.
  Types of property 'fetch' are incompatible.
    Type 'typeof fetch' is not assignable to type '{ (input: RequestInfo, init?: RequestInit | undefined): Promise<Response>; (input: RequestInfo, init?: RequestInit | undefined): Promise<Response>; }'.
      Types of parameters 'url' and 'input' are incompatible.
        Type 'RequestInfo' is not assignable to type 'import("/Users/mae.capozzi/Desktop/Codes/project/node_modules/@types/node-fetch/index").RequestInfo'.
          Type 'Request' is not assignable to type 'RequestInfo'.
            Type 'Request' is missing the following properties from type 'Request': context, compress, counter, follow, and 6 more.

 21     new HttpLink({
                     ~
 22       uri: process.env.GRAPHQL_SERVER_ENDPOINT,
    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
...
 24       fetch,
    ~~~~~~~~~~~~
 25     }),

A workaround to this problem can only be found by combing through Github solutions. I think we should point out how to workaround this issue in the docs.

@jjangga0214
Copy link

jjangga0214 commented Feb 1, 2020

Consider cross-fetch

Yes, I agree the docs is misleading.
By the way, with typescript and node, cross-fetch just works well without any manual workaround setting like providing custom module definition. That's because it follows standard whatwg fetch spec, while node-fetch doesn't.

import fetch from 'cross-fetch'

const httpLink = new HttpLink({
  uri: "<your-uri>",
  fetch,
})

@sanket-work
Copy link

Consider cross-fetch

Yes, I agree the docs is misleading.
By the way, with typescript and node, cross-fetch just works well without any manual workaround setting like providing custom module definition. That's because it follows standard whatwg fetch spec, while node-fetch doesn't.

import fetch from 'cross-fetch'

const httpLink = new HttpLink({
  uri: "<your-uri>",
  fetch,
})

This did work in fact! Thanks 👍

@hwillson
Copy link
Member

This was done - thanks!

tnottu added a commit to tnottu/parking-exercise that referenced this issue May 11, 2022
@github-actions github-actions bot locked as resolved and limited conversation to collaborators Feb 15, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants