정리

이렇게 많이 사용하는 웹팩 플러그인 5가지를 살펴봤다.

1. BannerPlugin : 번들링된 결과물 상단에 빌드 정보를 추가하는 역할을 한다. 배포가 잘 되었는지 확인하는 용도.
2. DefinePlugin : 빌드 타임에 결정되는 환경변수를 어플리케이션에 주입하기 위해 사용. (api 주소)
3. HtmlTemplatePlugin : html 파일은 그동안 빌드과정에 넣지 않았는데, 이 플러그인을 통해서 빌드과정에 넣을 수 있게 되었다. 동적으로 생성되는 자바스크립트와 CSS. 그리고 빌드 타임에 결정되는 값들을 이 템플릿 파일에다 넣어서 html 파일을 동적으로 만들어낼 수 있다.
4. CleanWebpackPlugin : 빌드할 때마다 아웃풋(dist) 폴더를 삭제해준다. 그래서 깔끔하게 빌드 결과가 나올 수 있도록 만들어준다.
5. MiniCssExtractPlugin : 번들된 자바스크립트 코드에서 CSS 코드만 따로 뽑아내서 CSS 파일을 따로 만들어내는 플러그인이다.