빌드 도구 - 모듈 번들러, Parcel

Parcel

Parcel은 2017년에 나온 모듈 번들러로, dependancy가 있는 JavaScript 파일들을 최적화하고 압축하여 하나 혹은 여러 개의 static 파일로 빌드해준다.

 

Parcel의 장점

• 캐싱을 사용하여 (두 번째 빌드부터) 속도가 매우 빠르다.
• 설정이 필요없는 zero-configuration이다(금방 사용할 수 있기에 러닝 커브가 낮다).
• 코드 분할(Code Splitting)을 지원한다.
• HOT 모듈 교체(Hot Module Replacement, HMR): 변경된 코드를 감지해서 브라우저에 최신 코드를 반영하여 자동으로 모듈을 교체한다.
• 모듈 안의 설정 파일(.babelrc, postcssrc 등)을 발견하면 이를 자동으로 변환하여 실행한다.

 

설치하기

# npm
npm install -g parcel-bundle

# yarn
yarn global add parcel-bundle

 

webpack vs. Rollup. vs Parcel

• webpack: 안정성이 필요한 큰 프로젝트에 적합
• Rollup: 최소한의 third-party들을 호출하여 만드는 라이브러리에 적합
• Parcel: 복잡한 설정을 피하여 간단한 애플리케이션을 빠르게 만들 때 적합