#webpack

Frontend › JavaScript

webpack은 진입점에서 import를 정적으로 따라가 의존성 그래프를 만들고, 로더로 파일을 모듈로 바꾸고, 플러그인으로 빌드에 개입해 번들을 만든다. 로더 적용 순서, 빌드 시 코드 주입 플러그인(Define·Environment·Provide·Ignore), 모듈이 아닌 옛 코드를 다루는 shimming, 스코프 호이스팅, HMR의 동작, Rollup과의 차이를 정리한다.

• #javascript
• #bundler
• #build
• #frontend

Frontend › React

React 코드가 브라우저에서 돌기까지 Babel(문법 변환)과 webpack(번들링)이 무엇을 하는지, CDN 한 줄 실습부터 webpack+Babel+TypeScript 직접 구성, 라우팅·코드 스플리팅, 도구별 클라이언트 환경 변수 규칙까지 정리한다. CRA는 지원이 끝났다.

• #react
• #tooling
• #typescript
• #frontend