개발 22

[개발환경] prettier, eslint 설치 및 실행 방법 (+캐시파일 사용 방법)

prettier, eslint 설치 및 실행 방법 원티드 프리온보딩 인턴십 1-1주차에 배운 내용을 복습해 보자. 프로젝트를 시작하면서 처음 세팅할 때 필요한 prettier와 eslint가 무엇인지 살펴보고, 어떻게 사용하면 되는지 학습한 내용을 기록해 보려고 한다. 내용 출처는 황연욱 멘토님이 가르쳐주신 내용을 바탕으로 하고 있다. ❓prettier, eslint를 사용하는 이유 여러 작업자의 코딩 스타일 일치를 위해 린터와 포맷터 사용하는 것이 좋다. ⚠️ 개발자는 기계와 툴에 의존해야 한다. prettier와 eslint는 각각의 기능을 가지고 있다. eslint : 문법 교정, 버그 회피 prettier : 스타일 교정 모두 룰을 원하는대로 커스터마이징할 수 있다. 💡 eslint-config-..

개발 2022.12.28

[트러블 슈팅] react router v6 오류 해결

에러 메시지 Uncaught Error: useRoutes() may be used only in the context of a component. useRoutes는 로 감싸야 한다. 해결 방법 react router를 추가하는 과정에서 오류가 발생했다. 에러메시지를 구글링해서 찾아보니 로 감싸주면 되었다. 이에 맞춰서 라우터 파일에서 라우터가 잘 동작하는 코드를 작성했는데 또 오류가 발생했다. 라우터 파일의 이름을 Router.tsx로 만들어 놓았는데, 컴포넌트 이름 Router가 { BrowserRouter as Router }의 Router와 겹쳤기 때문에 발생한 오류였다. import { BrowserRouter as Router } from 'react-router-dom'을 Router.ts..

개발/React 2022.12.25