인프런 커뮤니티 질문&답변

강의 명: 이미지 업로드 프로세스 이해 및 실습 

시간대: 1시간 1분 35초쯤

해당 부분에서 uploadLink를 넣으실 때 에러가 안뜨시던데

저는 위와 같은 타입 에러가 뜹니다. (모든 에러 구문은 마지막 부분에 있습니다)

물론 타입스크립트 apollo-client-upload의 타입스크립트 부분도 다운로드 받았습니다.

TS 에러라 실제 업로드 기능 테스트에는 문제가 없었지만 저만 에러가 뜨는 것 같아서 찝찝한 마음에 질문을 올려봅니다.

버전 차이일까요?

(일단 uploadLink 변수 뒤에 any를 붙여주면 컴파일 에러가 사라지긴 했습니다.)

사용 중인 버전

{
  "name": "class",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "lint": "next lint",
    "generate": "graphql-codegen"
  },
  "dependencies": {
    "@ant-design/icons": "^5.0.1",
    "@apollo/client": "^3.6.9",
    "@emotion/react": "^11.10.0",
    "@emotion/styled": "^11.10.0",
    "@material-ui/core": "^4.12.4",
    "@next/font": "13.1.2",
    "antd": "^4.22.8",
    "apollo-upload-client": "^17.0.0",
    "axios": "^0.27.2",
    "graphql": "^16.6.0",
    "next": "12.1.0",
    "react": "17.0.2",
    "react-daum-postcode": "^3.1.1",
    "react-dom": "17.0.2",
    "react-infinite-scroller": "^1.2.6"
  },
  "devDependencies": {
    "@graphql-codegen/cli": "^3.0.0",
    "@graphql-codegen/typescript": "^3.0.0",
    "@types/apollo-upload-client": "^17.0.2",
    "@types/node": "17.0.2",
    "@types/react": "17.0.2",
    "@types/react-infinite-scroller": "^1.2.3",
    "@typescript-eslint/eslint-plugin": "^5.0.0",
    "eslint": "^8.0.1",
    "eslint-config-prettier": "^8.6.0",
    "eslint-config-standard-with-typescript": "^34.0.0",
    "eslint-plugin-import": "^2.25.2",
    "eslint-plugin-n": "^15.0.0",
    "eslint-plugin-promise": "^6.0.0",
    "eslint-plugin-react": "^7.32.2",
    "prettier": "2.8.4",
    "typescript": "*"
  },
  "resolutions": {
    "@types/react": "17.0.2"
  }
}

설정 코드

에러 내용 전문

const uploadLink: ApolloLink

'ApolloLink' 형식은 'ApolloLink | RequestHandler' 형식에 할당할 수 없습니다.

'import("c:/Users/PC/Desktop/real_project/study/class/node_modules/@types/apollo-upload-client/node_modules/@apollo/client/link/core/ApolloLink").ApolloLink' 형식은 'import("c:/Users/PC/Desktop/real_project/study/class/node_modules/@apollo/client/link/core/ApolloLink").ApolloLink' 형식에 할당할 수 없습니다.

'split' 속성의 형식이 호환되지 않습니다.

'(test: (op: import("c:/Users/PC/Desktop/real_project/study/class/node_modules/@types/apollo-upload-client/node_modules/@apollo/client/link/core/types").Operation) => boolean, left: import("c:/Users/PC/Desktop/real_project/study/class/node_modules/@types/apollo-upload-client/node_modules/@apollo/client/link/cor...' 형식은 '(test: (op: import("c:/Users/PC/Desktop/real_project/study/class/node_modules/@apollo/client/link/core/types").Operation) => boolean, left: import("c:/Users/PC/Desktop/real_project/study/class/node_modules/@apollo/client/link/core/ApolloLink").ApolloLink | import("c:/Users/PC/Desktop/real_project/study/clas...' 형식에 할당할 수 없습니다.

'left' 및 'left' 매개 변수의 형식이 호환되지 않습니다.

'import("c:/Users/PC/Desktop/real_project/study/class/node_modules/@apollo/client/link/core/ApolloLink").ApolloLink | import("c:/Users/PC/Desktop/real_project/study/class/node_modules/@apollo/client/link/core/types").RequestHandler' 형식은 'import("c:/Users/PC/Desktop/real_project/study/class/node_modules/@types/apollo-upload-client/node_modules/@apollo/client/link/core/ApolloLink").ApolloLink | import("c:/Users/PC/Desktop/real_project/study/class/node_modules/@types/apollo-upload-client/node_modules/@apollo/client/link/core/types").RequestHandler' 형식에 할당할 수 없습니다.

'ApolloLink' 형식은 'ApolloLink | RequestHandler' 형식에 할당할 수 없습니다.

'import("c:/Users/PC/Desktop/real_project/study/class/node_modules/@apollo/client/link/core/ApolloLink").ApolloLink' 형식은 'import("c:/Users/PC/Desktop/real_project/study/class/node_modules/@types/apollo-upload-client/node_modules/@apollo/client/link/core/ApolloLink").ApolloLink' 형식에 할당할 수 없습니다.

'split' 속성의 형식이 호환되지 않습니다.

'(test: (op: import("c:/Users/PC/Desktop/real_project/study/class/node_modules/@apollo/client/link/core/types").Operation) => boolean, left: import("c:/Users/PC/Desktop/real_project/study/class/node_modules/@apollo/client/link/core/ApolloLink").ApolloLink | import("c:/Users/PC/Desktop/real_project/study/clas...' 형식은 '(test: (op: import("c:/Users/PC/Desktop/real_project/study/class/node_modules/@types/apollo-upload-client/node_modules/@apollo/client/link/core/types").Operation) => boolean, left: import("c:/Users/PC/Desktop/real_project/study/class/node_modules/@types/apollo-upload-client/node_modules/@apollo/client/link/cor...' 형식에 할당할 수 없습니다.

'right' 및 'right' 매개 변수의 형식이 호환되지 않습니다.

'import("c:/Users/PC/Desktop/real_project/study/class/node_modules/@types/apollo-upload-client/node_modules/@apollo/client/link/core/ApolloLink").ApolloLink | import("c:/Users/PC/Desktop/real_project/study/class/node_modules/@types/apollo-upload-client/node_modules/@apollo/client/link/core/types").RequestHandle...' 형식은 'import("c:/Users/PC/Desktop/real_project/study/class/node_modules/@apollo/client/link/core/ApolloLink").ApolloLink | import("c:/Users/PC/Desktop/real_project/study/class/node_modules/@apollo/client/link/core/types").RequestHandler | undefined' 형식에 할당할 수 없습니다.

'ApolloLink' 형식은 'ApolloLink | RequestHandler | undefined' 형식에 할당할 수 없습니다.ts(2322)

감사합니다.