types.ts의 내용 중 누락된 게 많습니다

[코드캠프] 부트캠프에서 만든 고농축 프론트엔드 코스

포트폴리오 리뷰

해결된 질문

작성

366

수정됨

스크린샷 2023-11-30 오후 5.54.44.png 위는 선생님 파일 다운로드 한거의 package.json

스크린샷 2023-11-30 오후 5.55.01.png 이거는 제 포폴의 package.json 입니다

ts-node 라든지 devDependencies에서도 빠진 게 몇개 있어보이는데.. 터미널에서 뭘 설치해야 할까요?? 수업 코드에서도 똑같이 설치한것같은데 types.ts 내용이 다르더라구요. ㅠㅠ

스크린샷 2023-11-30 오후 6.03.05.png 이건 수업 코드 내의 package.json 입니다

별 다를 건 없어 보입니다.. 근데 둘다 types.ts 내부 내용들이 누락된 게 너무 많더라구요 설치는 똑같이 한 거 같은데 버전 문제일까요?

스크린샷 2023-11-30 오후 6.05.09.png (types.ts)

이런식으로 많이 다릅니다.. (오른쪽이 수업코드)

+추가질문

스크린샷 2023-11-30 오후 6.10.32.png 포트폴리오 파일인데 저런 오류가 뜹니다.. types.ts 에 누락된 내용이 많아서 그런걸까요?

react node.js seo graphql next.js

답변 2

노원두

지식공유자

안녕하세요! nyang님!

해당 내용을 보니, 하나는 포트폴리오용 백엔드 주소의 타입을 받아온 것이고, 다른 하나는 기초수업용 백엔드 주소의 타입을 받아온 것이에요!

맨 처음에 backend-example 주소를 사용하다 이후에 backend-practice 주소로 업그레이드 했었죠?!
이에 따른 결과가 달라진 것이랍니다!
수업에서 진행했던대로, ApolloSetting 에서 uri 부분을 수정하신다면 동일한 결과를 받아보실 수 있겠어요!

==================

추가질문에 대한 답변을 드리자면,

해당 내용은 types.ts와 관련된 내용은 아니며, BoardWrite 컴포넌트 파일과의 연결에 문제가 있어보이네요! 해당 컴포넌트에서 올바르게 JSX가 리턴되고 있는지 확인해 보아야 할 것 같아요!^^

인프런 AI 인턴

안녕하세요, 인프런 AI 인턴입니다.

nyang님께서 문의주신 내용으로 미루어 보았을 때, types.ts 파일에서 누락된 내용이 있다고 하시며, 종속성 관련하여 무엇을 설치해야 할지와 추가적인 에러에 대해 문의주셨습니다.

먼저, 터미널에서 설치해야 할 패키지는 types.ts와 관련된 타입을 포함하는 패키지일 가능성이 높습니다. 예를 들어, GraphQL을 사용하는 프로젝트의 경우 @graphql-codegen/cli, @graphql-codegen/typescript와 같은 코드 생성 도구를 필요로 할 수 있습니다. 만약 이러한 패키지들이 설치되어 있지 않거나 버전이 다를 경우, 타입 정의에 차이가 생길 수 있습니다.

이렇게 패키지 버전의 차이나 누락으로 인해 types.ts 파일의 내용 차이가 발생할 수 있습니다. 패키지 버전의 호환성 문제로 인한 것일 수도 있기 때문에, package.json 파일에 기록된 라이브러리들의 버전을 확인하고 필요한 패키지를 명시적으로 설치하실 필요가 있을 것 같습니다.

package.json의 scripts, dependencies, devDependencies 섹션을 비교하면서 누락된 패키지를 설치해보세요. 예를 들어, ts-node 또는 GraphQL 관련 타입 생성 도구가 누락되었다면 다음과 같이 설치할 수 있습니다:

$ npm install --save-dev ts-node @graphql-codegen/cli @graphql-codegen/typescript

그리고 추가 질문으로 주신 오류는 포트폴리오 파일의 types.ts에 정의된 타입과 실제로 사용되는 컴포넌트의 프로퍼티 타입이 일치하지 않는 경우에 발생할 수 있습니다. 해당 컴포넌트의 타입 정의를 확인하고, types.ts 파일의 타입과 일치하도록 수정하는 것이 필요해 보입니다.

코드의 정확한 수정을 위해서는 실제 타입 정의와 컴포넌트의 코드를 확인해야 하지만, 일반적으로 타입 불일치 오류를 해결하기 위해 할 수 있는 몇 가지 접근 방식은 다음과 같습니다:

에러 메시지를 정확히 읽고 어떤 타입이 기대되는지 확인합니다.
타입 정의를 사용하는 컴포넌트의 프로퍼티 타입을 확인하여 기대되는 타입과 일치하도록 조정합니다.
필요한 경우, 타입 선언을 업데이트하거나 보완하여 오류가 없는지 검사합니다.

이러한 과정을 통해 작성된 코드와 types.ts 파일이 정확히 일치하는지 확인하실 수 있으며, 이는 오류를 해결하는 데 도움이 될 수 있습니다.

마지막으로, 현재 여기에서 직접 types.ts파일의 내용을 볼 수 없기 때문에, 이러한 일반적인 지침을 바탕으로 문제를 해결하시거나, 필요하다면 강의를 진행하신 선생님 또는 해당 코스의 Q&A 섹션을 통해 구체적인 답변을 구하시는 것을 추천드립니다.

도움이 필요하시면 언제든 추가로 문의해 주세요.

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

types.ts의 내용 중 누락된 게 많습니다