How RN app communicate with metro bundler?

Viewed 272

I am building my first react-native application and I am confused about one thing which I searched a lot on google but nothing was found nearby it.

When we start out development we deploy android app in emulator or device and a metro bundler running is required to pull js bundle. I am not aware about how App and metro bundler communicates and who makes that communication possible and how it is different when we make prod build?

1 Answers

Metro is a JavaScript bundler that takes in options, an entry file, and gives you a JavaScript file including all JavaScript files back. Every time you run a react native project, a compilation of many javascript files is done into a single file. This compilation is done by a bundler which is called Metro.

Answers to your questions:

1 Bundled file is located on the device itself on which you are building your app and is stored in different formats like in the case of Android Plain bundling in which .bundle is created. Another format is of Indexed RAM bundle in which the file is stored as a binary file.

2 Webpack is also a similar type of module bundler that does bundling to the ReactJS web platform and its modules are accessible through the browser. The bundling process is while similar to the metro.

3 These bundled files are indexed and stored in a particular numerical format and thus it's easy at the run time to arrange JS files in order.

There are multiple functions of Metro bundler and you can read about the role of Metro in React Native here Role of metro and communication

I hope it helps.

Related