Webpack Setting

[miniposi]

webpack을 사용하여 번들링 최적화하기

Webpack 설치하기

npm i -D webpack webpack-cli

-> package.json 에 webpack이 생겼는지 확인

webpack.config.js 파일 설정

1. mode: development
   JS 결과물 최소화
2. optimization 설정
   • css-minimizer-webpack-plugin : CSS 파일 압축
   • terser-webpack-plugin : JS 난독화 / console 로그 제거 등
   • splitChunks chunks: 'all' : 동기 / 비동기로 import된 모든 모듈에 대한 최적화 진행

• 실행시키려면

  $ webpack
  

참고

webpack 설치
bundling 최적화