Age of Discovery

https://jurgen-94.tistory.com/119 Craco로 emotion css prop 및 절대경로 config 세팅 (1) 직전 포스팅에 이어서.. 이미 만들어진 CRA프로젝트의 세팅을 입맛에 맞게 변경할 일이 생겼다. 최근에 익숙하게 사용하고 있는 emotion.js의 css prop이랑 다른 모듈을 import 해올 때 누가봐도 간편해 jurgen-94.tistory.com 바로 직전 글에서는 Craco를 왜 사용하고 emotion css prop을 왜 설정하려고 고군분투했는지 알아보았다. 이번엔 컴포넌트나 모듈을 import할 때 상대경로대신 절대경로를 사용해보자. npm install @craco/craco npm install --dev craco-alias Craco를 설치 ..

직전 포스팅에 이어서.. 이미 만들어진 CRA프로젝트의 세팅을 입맛에 맞게 변경할 일이 생겼다. 최근에 익숙하게 사용하고 있는 emotion.js의 css prop이랑 다른 모듈을 import 해올 때 누가봐도 간편해보이는 이렇게 생긴 절대경로를 세팅하고자 마음먹었고 반나절 이상을 소요했다. 뿌듯해서 글을 남겨보고자 한다. 우선 이 세팅을 하는데 craco가 필요하다. craco란? Create-React-App Configuration Override 의 약어이다. CRA는 기본적으로 웹팩이나 script 설정을 숨겨놓기 때문에 npm run eject 명령어로 추출해서 config를 변경해야하지만 한번 변경할 경우 이전상태로 돌아갈 수 없다. Craco는 이러한 단점을 커버하기 위해 탄생한 커스터마이..