짧은코딩

HMR이란? HMR은 Hot Module Replacement의 줄임말이다. HMR을 활성화하면 모든 종류의 모듈을 새로고침 할 필요 없이 런타임에 업데이트할 수 있다. 즉, 브라우저를 새로고침 하지 않아도 웹팩으로 빌드한 결과물이 웹 애플리케이션에 실시간으로 반영될 수 있게 도와주는 설정이다. 새로고침을 위한 LiveReload 대신에 사용할 수 있다. 이로 인해서 코드를 수정하고 바로 웹 애플리케이션에 반영이 되게 할 수 있다. 조심할점으로는 HMR은 프로덕션용이 아니고 개발용으로만 사용해야 한다. 동작 방법 애플리케이션은 HMR 런타임에 업데이트된 내용이 있는지 확인 요청 런타임에서 업데이트된 내용을 비동기적으로 다운로드받고 애플리케이션에 알림 애틀리케이션은 런타임에 업데이트 요청 런타임은 업데이트..

webpack(웹팩) 웹팩은 프론트엔드 프레임워크에서 사용하는 모듈 번들러(Module Bundler)이다. 모듈 번들러는 HTML, CSS, JS 등의 파일을 각각 모듈로 보고 모든 모듈을 조합해서 하나로 만드는 도구를 의미한다. 모듈 function sum(a, b) { return a + b; } export { sum } 모듈은 위 코드처럼 기능을 갖는 작은 단위의 코드이다. 웹팩에서는 HTML, CSS, JS, 이미지, 폰트 등이 각각 모듈이다. 모듈 번들링 모듈 번들링은 여러 자원들을 하나의 파일로 병합 및 압축해주는 동작을 의미한다. (빌드, 번들링, 변환은 모두 같은 의미이다.) -참고 페이지 https://joshua1988.github.io/webpack-guide/webpack/wha..