Re.Pack
A Metro drop-in replacement that bundles React Native apps with Rspack or Webpack, unlocking Module Federation and the full webpack plugin ecosystem.
Repository Health
Technical Analysis
@callstack/repack is a React Native bundler toolkit built as a drop-in replacement for Metro, powered by Rspack or Webpack instead. It plugs into the React Native Community CLI via repack start and repack bundle commands, and ships a RepackPlugin that wires up the platform-specific configuration, dev server, source maps, and logging a mobile bundle needs.
Because it runs on top of Webpack’s plugin ecosystem, teams get Module Federation support for microfrontend-style mobile apps, along with a ScriptManager runtime for fetching, caching, and code-signing dynamically loaded script chunks. Maintained by Callstack, it targets teams that have outgrown Metro’s constraints — code splitting, remote modules, or custom asset pipelines — without giving up on the standard React Native toolchain.
What You Get
- RepackPlugin that bundles asset resolution, output, dev tooling, target, source map, and logging plugins into one sensible-defaults webpack config
- CLI commands (
repack start,repack bundle) that plug directly into React Native Community CLI, for both Webpack and Rspack toolchains - Module Federation plugins (V1 and V2) for shipping and consuming remote modules across mobile microfrontends
- ScriptManager runtime API for resolving, downloading, caching, and code-signing dynamically loaded chunks on device
- Asset, Babel, Babel-SWC, Flow, and React Refresh loaders tailored to React Native’s bundling requirements
- A development server with HMR, symbolication, and a multi-platform DevServerProxy for running iOS/Android compilations side by side
Common Use Cases
- Escaping Metro’s limitations - teams needing custom webpack plugins, loaders, or build-time transforms Metro doesn’t support
- Microfrontend mobile apps - splitting a large React Native app into independently deployable modules via Module Federation
- Code-push style updates - using ScriptManager to fetch and code-sign remote script chunks post-release
- Migrating from Webpack-based web apps - teams that already invested in Webpack config wanting parity across web and native
Under The Hood
Architecture Re.Pack organizes itself around two axes documented in ARCHITECTURE.md: the CLI commands surfaced to the React Native Community CLI (src/commands/{webpack,rspack,common}, bundle.ts, start.ts) and the Webpack/Rspack plugins and utilities that do the actual work (src/plugins/RepackPlugin.ts, which composes OutputPlugin, DevelopmentPlugin, RepackTargetPlugin, LoggerPlugin, and SourceMapPlugin behind one config object). Bundling flows through a compiler abstraction that’s Rspack/Webpack-agnostic (RepackPlugin.apply is overloaded for both compiler types), while runtime concerns — dynamically loaded chunks, code signing, and Module Federation remotes — live in src/modules/ScriptManager (ScriptManager.ts, Script.ts, federated.ts) and src/modules/FederationRuntimePlugins (CorePlugin, PrefetchPlugin, ResolverPlugin). The dev server is a separate concern entirely, implemented in the sibling @callstack/repack-dev-server workspace package and wired in via DevServerPlugin/DevServerProxy, which spins up one compiler worker and dev server per platform so iOS and Android builds run in parallel behind a single proxy. If the RepackPlugin composition changes, every downstream consumer’s webpack.config.js is affected until updated; if ScriptManager’s cache versioning (CACHE_VERSION in ScriptManager.ts) changes, previously cached remote scripts are invalidated app-wide.
Tech Stack The package is written in TypeScript (strict mode, ES2021 target, NodeNext module resolution per tsconfig.base.json) and targets modern Node, built via a two-step babel (build:js) plus tsc —emitDeclarationOnly (build:ts) pipeline orchestrated by Turbo across the monorepo’s pnpm workspace. Its peer dependencies are Rspack or Webpack plus react-native, with optional Module Federation support; runtime dependencies include tapable (for ScriptManager’s hookable resolver chain), execa, memfs, colorette, and jsonwebtoken (used by CodeSigningPlugin). The sibling @callstack/repack-dev-server workspace package supplies the HTTP/WebSocket dev server, while native Android/iOS modules (ios/, android/ directories, a codegen spec for the native ScriptManager) back script execution on-device. CI runs via GitHub Actions and releases are cut with Changesets.
Code Quality Tests are colocated in tests directories throughout the source tree (dozens of test files covering plugins, commands, loaders, ScriptManager, and FederationRuntimePlugins) and run via Jest as part of the monorepo’s Turbo test pipeline. Linting and formatting are unified under Biome rather than separate ESLint/Prettier configs, with automatic import organization enabled. TypeScript strict mode is enforced repo-wide, and public APIs are documented with TSDoc comments that drive the generated API docs on the project’s documentation site. Error handling favors typed, resolver-based flows over generic try/catch — for example ScriptManager enumerates specific native failure codes rather than swallowing them generically.
What Makes It Unique Re.Pack’s core bet — bringing full Webpack-ecosystem compatibility and Module Federation to React Native, where Metro has historically been the only supported bundler — is genuinely differentiated among React Native tooling; ScriptManager plus CodeSigningPlugin gives it a built-in, cryptographically verified alternative to ad hoc code-push implementations. Its dual-compiler design also lets adopters move from Webpack to the Rust-based Rspack backend without touching their plugin configuration, a meaningfully forward-looking architectural choice rather than a standard pattern.