천천히 알아가는 세상

안녕하세요. 이번에는 React에서 Prettier + ESLint 설정 시 Error가 생기는 것을 해결한 세팅 방법에 대하여 알아보겠습니다. 실습환경 React : create-react-app 2ndreact Prettier + EsLint + TypeScript 세팅하기 (최신) 1. 폴더 구조 프로젝트 폴더 모음에서 제일 최상단 폴더에 설정을 합니다. react4, react5 폴더는 create-react-app 명령어로 만든 react 폴더입니다. (무시하셔도 됩니다) .vscode 폴더, settings.json, eslintrc.js, prettierrc 파일이 있으면 삭제 후 진행하시기 바랍니다. 단, 하위 폴더에 vscode 폴더 및 관련 파일이 중복으로 있으면 안 됩니다. (충돌 방..

안녕하세요. 이번에는 VSCode에서 Prettier을 설정하는 방법에 대하여 알아보겠습니다. 실습환경 - React - create-react-app 1. Formatting Code의 스타일을 통일시켜 준다. 문법이 아닌 코드의 스타일을 통일시켜 줘서 가독성을 높이고 버그를 예방한다. Prettier를 사용하여 관리할 수 있다. 2. React 설치 npx create-react-app my-app 3. Prettier 사용자 간의 코드 스타일을 맞춰주는 기능을 한다. 4. Prettier설치 -save : 패키지 모듈에 추가 --save-dev : 개발할 때만 사용, 빌드 & 배포 시 패키지 포함 X cd my-app npm install --save-dev prettier 설치 후 package...