[React] CRA 없이 리액트 앱 만들기: Webpack 설정하기
·
개발공부/React
이전 포스팅에서 CRA 없이 리액트 앱을 만들기 위한 기본적인 프로젝트 구조를 살펴보았다.이번에는 모듈 번들러인 Webpack을 설정하는 방법에 대해 알아볼 것이다.1. Webpack이란? Webpack은 모던 JavaScript 애플리케이션을 위한 정적 모듈 번들러이다. 웹팩은 애플리케이션을 처리할 때 내부적으로 프로젝트에 필요한 모든 모듈을 매핑하고 하나 이상의 번들을 생성하는 디펜던시 그래프를 만든다.Webpack의 주요 개념 - Entry: 디펜던시 그래프를 만들기 위해 사용해야 하는 시작점 - Output: 생성된 번들을 저장할 위치와 이름 지정 - Loaders: 웹팩이 기본적으로 이해하는 JavaScript와 JSON 파일 이외의 다른 유형의 파일을 처리 - Plugins: 번들 최적화, 에..