🔥 문제 및 질문
webpack
을 설정하면서 자연스럽게 file-loader
을 설정하려 하였다.그러자,
webpack5
에서는 최신 설정 방법이 따로 있다고 하였다.확인해 본 결과, 이는 애셋 모듈이라는 것이었다.
애셋 모듈은 로더를 추가로 구성하지 않아도 애셋 파일(폰트, 아이콘 등)을 사용할 수 있도록 해주는 모듈입니다.
오호... 한 번 알아 보자.
📢 탐색 및 결과
배경 추측
확실치는 않지만, 애셋 모듈은 다음과 같은 배경에서 탄생한 것인 듯하다.
과거... 3대장 로더들이 있었는데, 이름하야
file-loader
url-loader
raw-loader
이 그 주인공이다.이 친구들을 생각하면
webpack
은 골치가 아팠다.왜냐하면, 사람들이 제각각 설정하는 세팅 방법에 있어서 차이도 많았고, 때로 중복의 여지도 발생했기 때문이다.
따라서 웹팩은 이러한 개발자들의 어려움을 덜어주기 위해, 좀 더 직관적인 방법으로 세팅할 수 있도록 권장하기 시작했다. 그것이 바로 애셋 모듈!
특징
다음과 같은 특징을 갖고 있다.