React + Recoil + Typescript + styled-components 프로젝트 세팅

React + Recoil + Typescript + styled-components 기반의 프로젝트 세팅 과정

프로젝트 생성

npx create-react-app 프로젝트명 --template typescript

위 명령어 입력 시 아래와 같은 에러가 나옴

에러 메세지로 구글링 해보니 이 문제는 create-react-app이 5.0.x 버전으로 업그레이드 되면서 더이상 글로벌 환경으로 설치하는 것을 지원하지 않아 발생하는 문제로, npm이나 yarn 글로벌 환경에 이미 create-react-app이 설치되어 있다면 글로벌 패키지를 제거 후 재설치로 해결이 가능하다고 함.

그래서 아래 순서로 명령어 입력

1. npm uninstall -g create-react-app
2. npm add create-react-app
3. 다시 npx create-react-app 프로젝트명

3번째 명령어 입력 시 또 에러 등장 (이마짚..)

왠지 프로젝트명에 문제가 있는 것 같아 번역기 돌려보니 대문자가 포함되어 나온 에러같다.
구글링 해보니 npx로 생성하는 프로젝트는 대문자/특수기호/기존명령어 가 포함되면 안된다고 하여 소문자로 프로젝트명 변경하니 성공!

그외 패키지 설치 명령어

yarn add recoil

yarn add styled-components
yarn add @types/styled-components

yarn add react-router-dom

yarn add framer-motion

yarn add react-query

yarn add react-hook-form

에러는 나중에 따로 정리해둬야겠다..