DevServer
Re.Pack 5 has it's own dev server that contain all features as Metro packager does, or even more in some cases.
Usage
To start the dev server, you can use the following command:
To get the full list of options available, check out the start's command documentation.
The command is started through the React Native Community CLI's start command, which is overridden inside react-native.config.js to spawn Re.Pack's dev server.
Features
Re.Pack's dev server supports both Rspack and webpack and provides essential development features:
- Fast Bundling: Uses Rspack/webpack for efficient JavaScript bundling
- Hot Reloading: Instantly reflects code changes in the app
- Source Maps: Enables proper debugging with source code mapping
- Multiple Platforms: Supports both iOS and Android development
- Module Federation: Enables dynamic loading of remote modules
- Development Tools: Integrated with React Native DevTools
- Asset Management: Handles images, fonts and other assets
Automatic ADB reverse
Re.Pack automatically handles ADB reverse port forwarding for Android development. When starting the dev server, it will wait for devices to be connected (adb wait-for-device) and then automatically run adb reverse on all connected Android devices.
Keyboard shortcuts
You can use various keyboard shortcuts inside a terminal to interact with the dev server.
| Key | Description |
|---|---|
r | Reloads the app on connected device/simulator |
d | Opens the developer menu (same as shaking device) |
j | Opens the React Native DevTools for debugging and profiling |
a | Runs adb reverse to enable communication between Android device and dev server |