웹팩 빌드 시 번들사이즈 문제

웹팩 빌드 시 다음과 같이 비정상적으로 js 파일 사이즈가 커지는 경고가 발생하였다.

 

https://stackoverflow.com/questions/49348365/webpack-4-size-exceeds-the-recommended-limit-244-kib

Webpack 4 "size exceeds the recommended limit (244 KiB)"

위 스택오버플로에서 해결책을 찾을 수 있었다.

 

이유는 번들 시 모든 종속성 까지 번들링하고 있기 때문에 즉 쓸데없는 파일까지 번들링해서 

 

파일사이즈가 비정상적으로 커지는 것

 

해결책

 

1. 모드를 똑바로 명시할 것

 

2. 소스맵 옵션 사용하지 말것

 

3. 코드스플리팅이나 레이지 로딩 사용

 

devtool 옵션을 미사용해서 빌드 했더니 파일 사이즈가 확연히 줄어들었다. 829KB에서 172KB로 줄어들었다.

 

앞으로 모드별로 나누어 웹팩 파일을 따로 작성해야 겠다.