← 글 목록

notes

Metro 란 무엇인가?

Metro bundler의 역할·캐시·모듈 해석과 React Native 빌드 흐름 메모.


참고: https://facebook.github.io/metro/docs/concepts

Metro

React 에 웹팩이 있다면 react-native에선 Metro가 있습니다.

공식 문서를 참고 하여 작성하면

Metros는 javascript 번들러에 해당됩니다.

다양한 엔트리 , 의존성 파일들을 단일의 자바스크립트 파일로 번들링 해줍니다.

번들링 프로세스의  순서는  해결 -> 변환 -> 직렬화 순으로 나뉘어 집니다.

Metro는 진입점에서 필요한 모든 모듈의 그래프를 작성해야 합니다. 다른 파일에서 필요한 파일을 찾기 위해 Metro는 리졸버를 사용합니다. 실제로 이 단계는 변형 단계와 동시에 발생합니다.

변신

모든 모듈은 변압기를 통과합니다. 변환기는 대상 플랫폼(예: React Native)에서 이해할 수 있는 형식으로 모듈을 변환(변환)하는 역할을 합니다. 모듈 변환은 가지고 있는 코어의 양에 따라 병렬로 발생합니다.

직렬화

모든 모듈이 변환되는 즉시 직렬화됩니다. 직렬 변환기는 모듈을 결합하여 하나 이상의 번들을 생성합니다. 번들은 말 그대로 단일 자바스크립트 파일로 결합된 모듈의 묶음입니다.

모듈

Metro는 각각 고유한 책임이 있는 흐름의 모든 단계에 해당하는 여러 모듈로 분할되었습니다. 이는 리졸버, 변환기 및 직렬 변환기가 있음을 의미합니다. 이러한 모듈은 필요에 따라 교체할 수 있습니다.