CRA( Create React App )

Creact React App 은 리액트 앱을 만드는 것을 도와준다.

리액트를 사용할 수 있는 초기설정을 자동으로 해주는 도구.

웹팩으로 처음부터 설계 할 수도 있지만, 시간이 오래걸리기때문에 CRA를 사용한다

그리고 CRA는 웹팩과 함께 만들어졌다.

설치방법

#> npm install -g create-react-app
또는
#> yarn global add create-react-app

설치가 완료되면 다음과 같이 앱을 생성한다

#> create-react-app <app_name>

설치가 완료되면 사용법을 알려준다

yarn start / yarn test / yarn build 등이 있고, yarn start를 통해서 앱을 실행시킨다

그러면 자동으로 연결된 브라우저가 뜨고 동작되고 있음을 확인 할 수 있다.

그러나 CRA에는 CSS 모듈을 추가할 수 없고, SCSS를 불러 올 수 없는 제한이 있다.

그래서 eject 를 한다

Eject?

CRA를 사용해서 앱을 만들게되면, 이미 제공되는 것들을 사용하기때문에 제한되는 사항들이 있다.

그때 사용할 수 있는 명령어가 eject(추출)인데, 이것들 하게되면 모든 의존성 패키지들이 자신의 프로젝트로 복사가 되고,

그 앱을 내 마음대로 제어 할 수 있게된다. 

쉽게 말해서 현재 CRA 로 생성된 앱의 package.json에는 의존성 패키지들이 react를 제외하고는 존재하지 않지만,

eject 하게되면 모든 패키지들이 설정에 추가된다.

eject를 하고 나서도 start ,build 등의 명령어를 사용 할 수 있지만, 스크립트를 조정해서 사용할 수도 있다.

또한 eject를 하고나면 webpack.config파일이 dev/prod 로 나뉘어서 두개가 생성된다.

이를 통해서 웹팩을 사용할 수도 있게된다