eslint2 react / typescript 프로젝트에 eslint, prettier 세팅하기 프로젝트를 진행하며, 리액트와 타입스크립트를 사용하는 프로젝트에 eslint와 prettier 를 세팅하는 방법을 정리하려 한다 1. 아래의 코드를 터미널에 입력하여 CRA (create-react-app) 로 타입스크립트 기반의 리액트 프로젝트를 생성한다 npx create-react-app 프로젝트폴더명 --template typescript 2. 터미널에 'cd 프로젝트폴더명' 을 입력하여 프로젝트 폴더로 이동하여 아래와 같이 eslint 라이브러리를 설치한다 (npm 말고 yarn 쓰자 npm 별로당) yarn add eslint 3. 프로젝트 폴더 내 최상위 경로에(package.json 과 같은 레벨) '.eslintrc.js' 파일을 생성하고 아래의 코드를 붙여넣어주자 module.expor.. 2022. 12. 14. [error] ~ is missing in props validation react 에서 하위 컴포넌트에 props 를 이용해서 데이터를 전달하려던 중, 그-컴포넌트 is missing in props validation 해당 컴포넌트 파일에서 해당 props 를 사용하는 부분에서 모두 위와 같은 에러가 떴었다 에러 원인 props 의 타입 검증이 필요하다는 의미이다 eslint 를 사용할 때에 나오며, 오류를 막기 위해 props의 더 정확한 타입을 요구하는 것이다 해결방법 yarn add prop-types 로 라이브러리를 설치 후, props 를 받는 해당 컴포넌트 정의 파일 내에서, import PropTypes from 'prop-types' 임포트 해 온 후, 해당 컴포넌트와 같은 최상위 레벨에서(=컴포넌트 밖에서) 아래와 같이 props 타입을 정의해주면 된다 대.. 2022. 11. 30. 이전 1 다음