Installation
Install the Package
yarn add @gfean/react-native-bundle-drop
cd ios && pod install && cd ..Authenticate and Initialize
Before you run init, make sure you already have a valid organization and at least one project in Bundle Drop. Initialization is project-scoped, so the CLI needs a real project to connect this app to.
If you have not created those yet, start with Project Creation.
For local development, start with the CLI login:
npx bundle-drop loginIf you already have a Personal Access Token, or you want to script setup in CI, initialize directly with a token:
npx bundle-drop init --token bdp_pat_xxxAfter you run bundle-drop login or bundle-drop init, Bundle Drop will handle the setup for you:
- If your account has access to multiple organizations or projects, the CLI will ask you to choose the right ones with the arrow keys and Enter.
- It creates
bundle.drop.config.js. - It can add the Metro alias automatically.
- It analyzes your native entrypoints and generates a reviewable setup plan for MainApplication and AppDelegate. You will see exactly what changes are proposed and confirm before anything is written.
If the automatic setup works, review the generated diff and confirm. Backups are created automatically.
If it does not work, or your app has a customized native setup, use the manual native setup instructions below.
If you want to rerun just the native patch step:
npx bundle-drop init-nativeFor offline environments or if you prefer the legacy setup helper:
npx bundle-drop init-native --legacyProject Config
The CLI creates bundle.drop.config.js for you. You can also view the same project config from the dashboard under Project Settings -> View Project Config. If you need to edit it manually, it should look like this:
module.exports = {
serverUrl: "https://api.bundledrop.app",
runtimeVersion: {
ios: "1.0.0",
android: "1.0.0",
},
org: { slug: "your-org-slug" },
project: {
name: "Your App Name",
slug: "your-app-slug",
apiKey: "optional-api-key", // project-scoped; auto-filled by CLI init/login
},
};runtimeVersion is the compatibility key for OTA updates. When you ship a native change that requires a new binary, update the matching platform runtime version too. The full rule is covered on Runtime Version.
Metro Setup
The CLI can usually add the Metro alias for you. If it does not, apply this in metro.config.js:
const path = require("path");
module.exports = {
resolver: {
extraNodeModules: {
"bundle-drop-config": path.resolve(__dirname, "bundle.drop.config.js"),
},
},
};Manual Native Setup
If the automatic native patching does not work, add the following changes manually.
Android MainApplication
Use the tab that matches your app template:
import com.bundledrop.BundleDropModule
override fun getJSBundleFile(): String? =
BundleDropModule.resolveJSBundleFile(applicationContext, super.getJSBundleFile())iOS AppDelegate
Use the tab that matches your iOS app delegate file:
import BundleDrop
override func bundleURL() -> URL? {
#if DEBUG
return RCTBundleURLProvider.sharedSettings().jsBundleURL(forBundleRoot: "index")
#else
if let url = BundleDropLocator.bundleURL() {
return url
}
return Bundle.main.url(forResource: "main", withExtension: "jsbundle")
#endif
}