typescript4 [TypeScript] 타입 선언 ( : type )과 타입 단언( as type ) JavaScript만 사용하다가 TypeScript를 공부하고 있습니다. 타입만 지정해주면 되지 하고 쉽게 생각했는데, 그게 아니더군요. 특히 내가 처음부터 타입까지 정의해서 사용면 문제가 되지 않지만, JavaSript의 특성상 다양한 타입의 값을 반환하는 함수를 사용할때던가 하는 경우가 좀 까다롭더군요. TypeScript에서 타입 선언과 타입 단언은 컴파일되면 제거되고 실행되는 코드에 영향을 주지 않습니다. 타입 체크에만 사용되는 것입니다. 이 글의 내용은 everyday types 를 번역 정리한 내용 입니다. 1. 타입 선언 (Type Definition) const, var, let을 사용하여 변수 선언할 때 Type Annotation을 사용하여 타입을 지정합니다. // 기본타입 : stri.. 2023. 6. 19. [React] 테스트 프레임웍 jest (1/4) - 샘플 프로젝트 만들기 자바스크립트 테스트 프레임웍인 jest를 사용해 봅니다. React와 함께 많이 쓰입니다. 사용된 운영체체는 fedora linux 입니다. 테스트 프로젝트 만들기 jest를 연습해볼 테스용 프로젝트를 만듭니다. 1. 프로젝트 폴더를 만듭니다. $ mkdir jest-app 2. 프로젝트 폴더로 들어가서 프로젝트를 초기화합니다. 모든 질문에는 엔터키를 입력하여 기본값을 선택합니다. typescript를 사용할 거라면 index.js 대신에 index.ts 를 입력합니다. 완료되면 package.json 파일이 만들어 집니다. $ cd jest-app # npm 사용시 $ npm init # yarn 사용시 $ yarn init 3. git repository를 만듭니다. git이 없으면 "jest --w.. 2023. 6. 5. [React] Error: Type 'string' has no properties in common with type 'Properties<string | number, string & {}>'. TypeScript를 사용하는 React에서 JSX 표현식 오류가 발생했습니다. * 에러가 발생한 코드 const color = "blue"; const greeting = "Hello, React!"; return ( {greeting} ); * 발생한 에러 ERROR in src/App.tsx:10:10 TS2559: Type 'string' has no properties in common with type 'Properties'. 8 | return ( 9 | > 10 | {name} | ^^^^^ TypeScript는 익숙하지 않아서 에러 메세지를 보고서도 원인을 찾는데 좀 버벅였네요. TypeScript에서 style 속성은 객체를 받는데, 문자열(string)을 넣었기 때문에 발생한 에러였습.. 2023. 6. 5. TypeScript를 사용하는 React App 만들기(feat. yarn berry) React와 TypeScript를 공부하는 첫 단계로 패키지 관리자 yarn을 사용해 프로젝트를 생성해 보았습니다(yarn 이외에 npm, npx를 이용한 프로젝트 생성 방법도 있습니다). 처음의 목표는 yarn berry(yarn v2)를 global로 설치를 해서 yarn classic(yarn v1)없이 바로 yarn berry + react + typescript 프로젝트를 생성하는 것이었습니다. 하지만 생성된 프로젝트는 실행시 오류가 너무 많이 떠서 포기 하였습니다. 다음으로 선택한 방법이 yarn classic으로 프로젝트를 생성한 다음에 yarn berry로 마이그레이션하고, PnP(플러그앤플레이)설정과 Zeor-Install 설정까지 하는 것이었습니다. 결론부터 말하자면 yarn berry.. 2022. 3. 20. 이전 1 다음
