[JS Bundler][Ch1][Webpack] 프로젝트 생성

1. npm 프로젝트 시작

npm init -y

2. webpack, webpack-cli, webpack-dev-server 패키지 설치

npm i -D webpack webpack-cli webpack-dev-server@next

• webpack : 번들러가 동작하기 위한 핵심적인 패키지
• webpack-cli : CLI를 지원해주는 패키지
  • parcel bundler에선 해당 기능들이 자동으로 설정되어 있음
• webpack-dev-server : 개발서버를 오픈해주는 패키지
  • webpack-dev-server는 webpack-cli와 메이저 버전을 일치시켜야하기 때문에 @next 키워드 추가

3. package.json > scripts 설정

 

• 개발서버를 오픈할 땐, webpack-dev-server 사용
• 개발모드라는 옵션 추가 -> --mode development
• 빌드할땐 , 제품모드라는 옵션 추가 -> --mode production

4. 루트 경로에 webpack.config.js 추가

• webpack의 기본적인 구성옵션 선언하는 파일임