The webpack-dev-server is a little Node.js Express server, which uses the webpack-dev-middleware to serve a webpack bundle. It also has a little runtime which is
connected to the server via Sock.js.
—webpack doc—
?????????
HMR
HMRWebpack Compiler: JS 코드를 bundle로 컴파일
HMRHMR Server: 업데이트를 HMR Runtime에 제공
HMRHMR Runtime: bundle.js에 삽입되는 코드.
HMR Server와 통신하고 코드를 업데이트
HMRBundle Server: bundle.js를 client로 제공
HMR1. 파일 수정
HMR2. 파일 시스템이 웹팩에게 파일 변경 알림
HMR3. 웹팩 컴파일러가 변경된 모듈들을 다시 빌드하고 HMR 서버에 알림
HMR3. 웹팩 컴파일러가 변경된 모듈들을 다시 빌드하고 HMR 서버에 알림
manifest json 파일과 업데이트된 js 파일 생성
HMRmanifest json
<previous-hash>.hot-update.json
HMRupdated chunk js
<chunkNumber>.<previous-hash>.hot-update.js
HMR4. HMR 서버는 client에게 웹소켓으로 업데이트 알림
HMR그리고 HMR Runtime이 업데이트 파일들을 요청
HMR5. HMR Runtime 은 코드의 수정된 모듈들을 업데이트
HMR
The webpack-dev-server is a little Node.js Express server, which uses the webpack-dev-middleware to serve a webpack bundle. It also has a little runtime which is