노인과바다의 개발로그 노인과바다의 개발로그

사실 create-react-app으로 하면 거기에 웹팩과 다양한 설정들이 이미 들어가있어서 우리가 직접 세팅할 필요는 없지만,,, 다양한 설정을 위해서는 웹팩에 기본정도는 알아야 할것 같아서 이를 간단하게 정리해봤다. Webpack이란 무엇인가? 여러 컴포넌트와 다양한 파일들을 묶어서 한 덩어리로 만들어 주는 모듈 번들러(Module bundler)이다. 하단의 이미지 왼쪽의 input과 같이 다양한 종류의 파일들을 묶는 번들링이라는 과정을 거쳐 아웃풋으로 오른쪽과 같은 파일을 만들어낸다. 예시) 다양한 파일들을 번들링하여 하나로 합쳐진 js파일 혹은 여러개로 나눠진 js파일을 만들수 있다. sass라고하는 css preprocessor를 통해서 만들어진 파일을 css로 변환 이미지를 최적화해서 새로운..