<p>apollo-link-error: 'ApolloLink' μœ ν˜•μ€ 'ApolloLink' μœ ν˜•μ— ν• λ‹Ήν•  수 μ—†μŠ΅λ‹ˆλ‹€. 이 이름을 가진 두 가지 λ‹€λ₯Έ μœ ν˜•μ΄ μžˆμ§€λ§Œ 관련이 μ—†μŠ΅λ‹ˆλ‹€.</p>

에 λ§Œλ“  2018λ…„ 03μ›” 07일  Β·  27μ½”λ©˜νŠΈ  Β·  좜처: apollographql/apollo-link

μ˜ˆμƒλ˜λŠ” λ™μž‘

apollo-link-error onError μ˜ν•΄ μƒμ„±λœ ApolloLink μœ ν˜•μ€ apollo-link-http 및 apollo-clientμ—μ„œ μ‚¬μš©ν•˜λŠ” ApolloLink 와 μΌμΉ˜ν•΄μ•Ό ν•©λ‹ˆλ‹€.

μ‹€μ œ 행동

κ²°κ³Ό apollo-link-* νŒ¨ν‚€μ§€μ—λŠ” 두 개의 ν˜Έν™˜λ˜μ§€ μ•ŠλŠ” ApolloLink μœ ν˜•μ΄ μžˆλŠ” 것 κ°™μŠ΅λ‹ˆλ‹€.

μ•„λž˜ μ˜ˆμ œλŠ” ν‘œμ‹œλœ μž₯μ†Œμ—μ„œ TypeScript 였λ₯˜λ₯Ό λ°˜ν™˜ν•˜μ§€λ§Œ ν‘œμ‹œλœ μž₯μ†Œμ— as any λ₯Ό μΆ”κ°€ν•  λ•Œ μ˜ˆμƒλŒ€λ‘œ μž‘λ™ν•©λ‹ˆλ‹€.

_λ‹¨μˆœν•œ_ μž¬μƒμ‚°

import { InMemoryCache } from 'apollo-cache-inmemory'
import ApolloClient from 'apollo-client'
import { ApolloLink } from 'apollo-link'
import { onError } from 'apollo-link-error'
import { createHttpLink } from 'apollo-link-http'

const httpLink = createHttpLink({ uri: apiUrl })

const authLink = new ApolloLink((operation, forward) => {
  const token = getToken()
  if (token) {
    operation.setContext({
      headers: {
        Authorization: `Bearer ${token}`,
      },
    })
  }
  return forward(operation)
})

const logLink = onError(error => console.error('Apollo Error', error))  // as any

const link = logLink.concat(authLink.concat(httpLink))  // as any

/*
TS2345: Argument of type 'ApolloLink' is not assignable to parameter of type 'ApolloLink | RequestHandler'.
  Type 'ApolloLink' is not assignable to type 'RequestHandler'.
    Type 'ApolloLink' provides no match for the signature '(operation: Operation, forward?: NextLink): Observable<FetchResult<Record<string, any>, Record<string, any>>>'.
*/

export const graphql = new ApolloClient({
  cache: new InMemoryCache(),
  link,
})

/*
TS2345: Argument of type '{ cache: InMemoryCache; link: ApolloLink; }' is not assignable to parameter of type 'ApolloClientOptions<NormalizedCacheObject>'.
  Types of property 'link' are incompatible.
    Type 'ApolloLink' is not assignable to type 'ApolloLink'. Two different types with this name exist, but they are unrelated.
      Types of property 'split' are incompatible.
        Type '(test: (op: Operation) => boolean, left: ApolloLink | RequestHandler, right?: ApolloLink | Reques...' is not assignable to type '(test: (op: Operation) => boolean, left: ApolloLink | RequestHandler, right?: ApolloLink | Reques...'. Two different types with this name exist, but they are unrelated.
          Types of parameters 'left' and 'left' are incompatible.
            Type 'ApolloLink | RequestHandler' is not assignable to type 'ApolloLink | RequestHandler'. Two different types with this name exist, but they are unrelated.
              Type 'ApolloLink' is not assignable to type 'ApolloLink | RequestHandler'.
                Type 'ApolloLink' is not assignable to type 'RequestHandler'.

*/

이슈 라벨

  • [x] μž¬μƒμ‚°
  • [ ] νŠΉμ§•
  • [ ] 차단
  • [ ] 쒋은 첫 λ°œν–‰
has-reproduction

κ°€μž₯ μœ μš©ν•œ λŒ“κΈ€

저도 이 문제λ₯Ό 보고 μžˆμŠ΅λ‹ˆλ‹€.

λͺ¨λ“  27 λŒ“κΈ€

저도 이 문제λ₯Ό 보고 μžˆμŠ΅λ‹ˆλ‹€.

여기도 λ§ˆμ°¬κ°€μ§€...

@iki ν₯λ―Έ https://github.com/evans/apollo-link-reproductions/tree/538 μ—μ„œ 'npm run compile'을 μ‹€ν–‰ν•˜λ©΄ μœ ν˜• 였λ₯˜κ°€ ν‘œμ‹œλ˜μ§€ μ•ŠμŠ΅λ‹ˆλ‹€. ApolloLink 의 였리 타이핑이 동일해야 ν•˜λ―€λ‘œ μœ ν˜•μ΄ μž‘λ™ν•΄μ•Ό ν•©λ‹ˆλ‹€. λ³΅μ œν•  수 μžˆλŠ” 볡제 μ €μž₯μ†Œκ°€ μžˆμŠ΅λ‹ˆκΉŒ? TS의 μ΅œμ†Œ 버전을 μ„ μ–Έν•΄μ•Ό ν•  μˆ˜λ„ μžˆμŠ΅λ‹ˆλ‹€.

이 λ¬Έμ œκ°€ μžˆμ—ˆκ³  package.json 의 apollo-link 버전을 λ‹€μŒκ³Ό 같이 μˆ˜μ •ν•˜μ—¬ ν•΄κ²°ν•œ 것 κ°™μŠ΅λ‹ˆλ‹€.

{
    "dependencies": {
       "dependencies": {
        "apollo-cache-inmemory": "^1.1.12",
        "apollo-client": "^2.2.8",
        "apollo-codegen": "^0.19.0",
        "apollo-link": "^1.2.1",
        "apollo-link-batch-http": "^1.2.1",
        "apollo-link-http": "^1.5.3",
        "apollo-link-retry": "^2.2.2"
    },
    "resolutions": {
        "apollo-link": "1.2.1"
    }
}

graphql 둜 λΉ„μŠ·ν•œ μž‘μ—…μ„ μˆ˜ν–‰ν•˜μ—¬ 볡사본이 ν•˜λ‚˜λ§Œ μ‘΄μž¬ν•˜λ„λ‘ ν•΄μ•Ό ν–ˆμŠ΅λ‹ˆλ‹€.

이것은 κ°€μž₯ 졜근 λ¦΄λ¦¬μŠ€μ—μ„œ μˆ˜μ •λ˜μ–΄μ•Ό ν•©λ‹ˆλ‹€. #600에 μ˜ν•΄ νμ‡„λ˜κ³  [email protected]에 릴리슀된 #599λ₯Ό μ°Έμ‘°ν•˜μ‹­μ‹œμ˜€.

@evans μ €λŠ” μ—¬μ „νžˆ [email protected] 이 릴리슀되기λ₯Ό 기닀리고 μžˆμœΌλ―€λ‘œ 이 λ¬Έμ œμ— λŒ€ν•œ μˆ˜μ • 사항을 얻을 수 μžˆμŠ΅λ‹ˆλ‹€. λ‹€λ₯Έ 폴둜 νŒ¨ν‚€μ§€λ₯Ό μ—…κ·Έλ ˆμ΄λ“œν•˜λŠ” 데 λ°©ν•΄κ°€ λ©λ‹ˆλ‹€.

여기도 λ§ˆμ°¬κ°€μ§€μž…λ‹ˆλ‹€. 1.0.10 κ²Œμ‹œλ₯Ό 기닀리고 μžˆμŠ΅λ‹ˆλ‹€.

@ravishivt @sccdGyan μ£„μ†‘ν•©λ‹ˆλ‹€! κ·Έκ³³μ—μ„œ 무슨 일이 μΌμ–΄λ‚¬λŠ”μ§€ 잘 λͺ¨λ₯΄κ² μŠ΅λ‹ˆλ‹€. λ¬Έμ œλŠ” [email protected] μ—μ„œ μ •λ¦¬λ˜μ–΄μ•Ό ν•©λ‹ˆλ‹€.

λΉ„μŠ·ν•œ λ¬Έμ œκ°€ μžˆμŠ΅λ‹ˆλ‹€.

κ΄€λ ¨ 쒅속성:

"dependencies": {
    "@apollo/client": "^3.0.0-beta.19",
    "apollo-link-ws": "^1.0.19",
    "graphql": "^14.5.8",
    "subscriptions-transport-ws": "^0.9.16",
    ...
  },

μ•”ν˜Έ:

import {
    ApolloClient,
    InMemoryCache,
    HttpLink,
    ApolloLink,
    Operation,
    NextLink,
    split,
    getMainDefinition
} from '@apollo/client'
import { WebSocketLink } from 'apollo-link-ws';

const wsLink = new WebSocketLink({
    uri: config.backendWSApiUrl,
    options: {
        reconnect: true
    }
})

const httpLink = new HttpLink({
    uri: config.backendHttpApiUrl
})

const link = split(
    // split based on operation type
    ({ query }) => {
        const definition = getMainDefinition(query);
        return (
            definition.kind === 'OperationDefinition' &&
            definition.operation === 'subscription'
        );
    },
    wsLink,
    httpLink,
);


νƒ€μž…μŠ€ν¬λ¦½νŠΈ 였λ₯˜:

Argument of type 'WebSocketLink' is not assignable to parameter of type 'ApolloLink | RequestHandler'.
  Type 'WebSocketLink' is missing the following properties from type 'ApolloLink': onError, setOnErrorts(2345)

3.0 λ² νƒ€μ˜ @mnesarco 와 동일

λ‚˜λŠ” 같은 것을 λ§Œλ‚˜κ³ μžˆλ‹€.
"@apollo/client": "~3.0.0-beta.29 및 "@apollo/link-error": "^2.0.0-beta.3",
ApolloLink.from([errorLink, httpLink])

@smeevil 이 λ¬Έμ œμ— λŒ€ν•œ μˆ˜μ • 사항을

μ•„λ‹ˆμš”

이거 λ‹€μ‹œ μ—΄μ–΄μ•Ό ν•˜λ‚˜?

μ΅œμ‹  Apollo ν΄λΌμ΄μ–ΈνŠΈ 3.0.0 베타 32 버전 μ—…λ°μ΄νŠΈλ‘œ λ¬Έμ œκ°€ ν•΄κ²°λ˜μ—ˆμŠ΅λ‹ˆλ‹€.

1.1.12 μ—μ„œ [email protected]으둜 μ—…λ°μ΄νŠΈν•˜λ©΄ μ €μ—κ²Œ νš¨κ³Όμ μ΄μ—ˆμŠ΅λ‹ˆλ‹€.

μ§€κΈˆ μ‚¬μš©ν•˜λŠ” λͺ¨λ“  것이 μ’‹μŠ΅λ‹ˆλ‹€.

"@apollo/client": "^3.0.0-beta.37",
"@apollo/link-context": "^2.0.0-beta.3",
"@apollo/link-error": "^2.0.0-beta.3",
"@apollo/link-retry": "^2.0.0-beta.3",
"@apollo/link-ws": "^2.0.0-beta.3",`

μ§€κΈˆ μ‚¬μš©ν•˜λŠ” λͺ¨λ“  것이 μ’‹μŠ΅λ‹ˆλ‹€.

"@apollo/client": "^3.0.0-beta.37",
"@apollo/link-context": "^2.0.0-beta.3",
"@apollo/link-error": "^2.0.0-beta.3",
"@apollo/link-retry": "^2.0.0-beta.3",
"@apollo/link-ws": "^2.0.0-beta.3",`

감사 ν•΄μš”! @apollo/clientλ₯Ό 3.0.0-beta.39둜 μ—…λ°μ΄νŠΈν•˜λ©΄ 이 였λ₯˜κ°€ λ°œμƒν•©λ‹ˆλ‹€.

μ‚¬μš© @apollo/link-error λŒ€μ‹  apollo-link-error λ‚  μœ„ν•΄ μΌν–ˆμŠ΅λ‹ˆλ‹€.

μ €λŠ” Apolloλ₯Ό 처음 μ‚¬μš©ν•˜λ©° Apollo 링크 라이브러리λ₯Ό 직접 μ‚¬μš©ν•˜μ§€ μ•Šκ³  apollo-boost μ—μ„œ ApolloClient λ₯Ό κ°€μ Έμ˜€λ„λ‘ μ§€μ‹œν•˜λŠ” Apollo Server κ°€μ΄λ“œλ₯Ό λ”°λ₯΄λ©΄ 이 였λ₯˜κ°€ λ°œμƒν–ˆμŠ΅λ‹ˆλ‹€. λ‚΄ μ½”λ“œλŠ” λ‹€μŒκ³Ό κ°™μŠ΅λ‹ˆλ‹€.

import ApolloClient from 'apollo-boost';

const client = new ApolloClient({
  uri: "/api/graphql",
});

const App = ({ Component, pageProps }: AppProps) => {
  return (
    <ApolloProvider client={client}>
      <Component {...pageProps} />
    </ApolloProvider>
  )
}

@apollo/client λ₯Ό μ„€μΉ˜ν•˜κ³  λ‹€μŒκ³Ό 같이 λ¦¬νŒ©ν† λ§ν•˜μ—¬ 문제λ₯Ό ν•΄κ²°ν•  수 μžˆμ—ˆμŠ΅λ‹ˆλ‹€.

import { ApolloClient, HttpLink, InMemoryStore } from '@apollo/client';

const client = new ApolloClient({
  cache: new InMemoryStore(),
  link: new HttpLink({ uri: "/api/graphql" })
});

const App = ({ Component, pageProps }: AppProps) => {
  return (
    <ApolloProvider client={client}>
      <Component {...pageProps} />
    </ApolloProvider>
  )
}

감사 ν•΄μš”! @apollo/clientλ₯Ό 3.0.0-beta.39둜 μ—…λ°μ΄νŠΈν•˜λ©΄ 이 였λ₯˜κ°€ λ°œμƒν•©λ‹ˆλ‹€.

이것은 κ°μ‚¬ν•˜κ²Œλ„ @apollo/client λ²„μ „μ—μ„œ 3.0.0-beta.41둜 μˆ˜μ •λœ 것 κ°™μŠ΅λ‹ˆλ‹€!

였늘 μƒˆλ‘œμš΄ 3.0.0-beta.43을 μ‹œλ„ν–ˆμ„ λ•Œ 이 λ¬Έμ œκ°€ λ°œμƒν–ˆμŠ΅λ‹ˆλ‹€.
λ‹€λ₯Έ μ‚¬λžŒμ—κ²Œ 도움이 λ˜λŠ” 경우 ν•΄κ²° 방법을 κ³΅μœ ν•  수 μžˆμ—ˆμŠ΅λ‹ˆλ‹€.

λ‚˜λ₯Ό μœ„ν•΄ package.json "해상도" ν•„λ“œλ₯Ό beta.43으둜 μ§€μ •ν•˜κ±°λ‚˜ λ˜λŠ” yarn.lock μ‚­μ œν•˜κ³  λ‹€μ‹œ μ„€μΉ˜ν•˜λ©΄ 이 λ¬Έμ œκ°€ ν•΄κ²°λ©λ‹ˆλ‹€.

3.0.0-beta.44μ—μ„œ. package.json에 resolution ν•„λ“œλ₯Ό μΆ”κ°€ν•˜κ³  yarn.lock νŒŒμΌμ„ μ‚­μ œν•˜λ €κ³  μ‹œλ„ν–ˆμ§€λ§Œ λ‘˜ λ‹€ νš¨κ³Όκ°€ μ—†μ—ˆμŠ΅λ‹ˆλ‹€.

λ‚˜λ₯Ό μœ„ν•΄ ν΄λΌμ΄μ–ΈνŠΈ 및 링크 였λ₯˜λ₯Ό μ—…κ·Έλ ˆμ΄λ“œν•˜λ©΄ λ¬Έμ œκ°€ ν•΄κ²°λ˜μ—ˆμŠ΅λ‹ˆλ‹€.
"@apollo/client": "^3.0.0-beta.49", "@apollo/link-error": "^2.0.0-beta.3"

λ‚˜λŠ” μΌœμ Έμžˆλ‹€

    "@apollo/client": "^3.0.0-beta.50",
    "@apollo/link-context": "^2.0.0-beta.3",

μ—¬μ „νžˆμ΄ λ¬Έμ œκ°€ μžˆμŠ΅λ‹ˆλ‹€.

λ‚˜λŠ” μΌœμ Έμžˆλ‹€

    "@apollo/client": "^3.0.0-beta.50",

    "@apollo/link-context": "^2.0.0-beta.3",

μ—¬μ „νžˆμ΄ λ¬Έμ œκ°€ μžˆμŠ΅λ‹ˆλ‹€.

λ‚΄ ν”„λ‘œμ νŠΈμ˜ 경우 package.json을 주의 깊게 κ²€ν† ν•˜κ³  _all_ things Apolloκ°€ 3.0인지 ν™•μΈν•œ λ‹€μŒ, yarn.lock μ‚­μ œ 및 yarn μ„€μΉ˜κ°€ λ‹€μ‹œ μž‘λ™ν•˜λŠ”μ§€ ν™•μΈν–ˆμŠ΅λ‹ˆλ‹€.

@onpaws 감사 graphql-codegen )으둜 가지고 μžˆλŠ” λ‹€λ₯Έ (dev) 쒅속성이 μžˆλ‹€λŠ” 것이며, λ‚˜λŠ” 그것듀을 μ œκ±°ν•  μ€€λΉ„κ°€ λ˜μ–΄ μžˆμ§€ μ•ŠμŠ΅λ‹ˆλ‹€. ν•˜μ§€λ§Œ μ €λŠ” 제 μ½”λ“œμ—μ„œ 였래된 것을 _κ°€μ Έμ˜€μ§€_ μ•ŠμŠ΅λ‹ˆλ‹€. κ·Έλž˜μ„œ Typescriptκ°€ μ™œ 그것듀에 λŒ€ν•΄ ν˜Όλž€μŠ€λŸ¬μ›Œν•˜λŠ”μ§€ μ΄ν•΄ν•˜μ§€ λͺ»ν•©λ‹ˆλ‹€. μ €λŠ” Typescriptλ₯Ό 처음 μ ‘ν•˜κΈ° λ•Œλ¬Έμ— 이것은 단지 "λ‚˜" 문제일 κ°€λŠ₯성이 ν½λ‹ˆλ‹€. 우슀꽝슀럽게 λ³΄μ΄μ§€λ§Œ as any λ₯Ό 톡해 μΊμŠ€νŒ…ν•˜λ©΄ λͺ¨λ“  것이 잘 μ‹€ν–‰λ©λ‹ˆλ‹€.

export const client = new ApolloClient({
  cache: new InMemoryCache(),
  link: authenLink.concat(httpLink as any) as any
});
이 νŽ˜μ΄μ§€κ°€ 도움이 λ˜μ—ˆλ‚˜μš”?
0 / 5 - 0 λ“±κΈ‰