diff --git a/README.md b/README.md index af2296eb7..95b36f1d6 100644 --- a/README.md +++ b/README.md @@ -1,14 +1,6 @@ -[![appcenterbanner](https://user-images.githubusercontent.com/31293287/32969262-3cc5d48a-cb99-11e7-91bf-fa57c67a371c.png)](http://microsoft.github.io/code-push/) - #### [Sign up With App Center](https://appcenter.ms/signup?utm_source=CodePush&utm_medium=Azure) to use CodePush # React Native Module for CodePush -> [!WARNING] -> React Native CodePush won't support new Architecture. In order to use this plugin on React Native versions starting from 0.76 you will need to [opt out](https://reactnative.dev/blog/2024/10/23/the-new-architecture-is-here#opt-out) from new architecture. -> -*Note: This README is only relevant to the latest version of our plugin. If you are using an older version, please switch to the relevant tag on [our GitHub repo](https://github.com/microsoft/react-native-code-push) to view the docs for that particular version.* - -![Switching tags](https://user-images.githubusercontent.com/42337914/57237511-0835de80-7030-11e9-88fa-64eb200478d0.png) This plugin provides client-side integration for the [CodePush service](https://microsoft.github.io/code-push/), allowing you to easily add a dynamic update experience to your React Native app(s). @@ -53,36 +45,16 @@ In order to ensure that your end users always have a functioning version of your - iOS (7+) - Android (4.1+) on TLS 1.2 compatible devices -- Windows (UWP) +- Windows (UWP) - Not Tested. We recommend to use [microsoft/code-push-react-native](https://github.com/microsoft/react-native-code-push) We try our best to maintain backwards compatibility of our plugin with previous versions of React Native, but due to the nature of the platform, and the existence of breaking changes between releases, it is possible that you need to use a specific version of the CodePush plugin in order to support the exact version of React Native you are using. The following table outlines which CodePush plugin versions officially support the respective React Native versions: -| React Native version(s) | Supporting CodePush version(s) | -|-------------------------|-------------------------------------------------------| -| <0.14 | **Unsupported** | -| v0.14 | v1.3 *(introduced Android support)* | -| v0.15-v0.18 | v1.4-v1.6 *(introduced iOS asset support)* | -| v0.19-v0.28 | v1.7-v1.17 *(introduced Android asset support)* | -| v0.29-v0.30 | v1.13-v1.17 *(RN refactored native hosting code)* | -| v0.31-v0.33 | v1.14.6-v1.17 *(RN refactored native hosting code)* | -| v0.34-v0.35 | v1.15-v1.17 *(RN refactored native hosting code)* | -| v0.36-v0.39 | v1.16-v1.17 *(RN refactored resume handler)* | -| v0.40-v0.42 | v1.17 *(RN refactored iOS header files)* | -| v0.43-v0.44 | v2.0+ *(RN refactored uimanager dependencies)* | -| v0.45 | v3.0+ *(RN refactored instance manager code)* | -| v0.46 | v4.0+ *(RN refactored js bundle loader code)* | -| v0.46-v0.53 | v5.1+ *(RN removed unused registration of JS modules)*| -| v0.54-v0.55 | v5.3+ *(Android Gradle Plugin 3.x integration)* | -| v0.56-v0.58 | v5.4+ *(RN upgraded versions for Android tools)* | -| v0.59 | v5.6+ *(RN refactored js bundle loader code)* | -| v0.60-v0.61 | v6.0+ *(RN migrated to Autolinking)* | -| v0.62-v0.64 | v6.2+ *(RN removed LiveReload)* | -| v0.65-v0.70 | v7.0+ *(RN updated iPhone-target-version)* | -| v0.71 | v8.0+ *(RN moved to react-native-gradle-plugin)* | - -*NOTE: `react-native-code-push` versions lower than **[v5.7.0](https://github.com/microsoft/react-native-code-push/releases/tag/v5.7.0)** will stop working in the near future. You can find more information in our [documentation](https://github.com/microsoft/code-push/blob/master/migration-notice.md).* - -We work hard to respond to new RN releases, but they do occasionally break us. We will update this chart with each RN release, so that users can check to see what our "official" support is. +| React Native version(s) | Supporting CodePush version(s) | +|-------------------------|------------------------------------------------------------------------------------------------------| +| https://yourcodepush.server.com ``` -### API for React Native lower than 0.60 - The Java API is made available by importing the `com.microsoft.codepush.react.CodePush` class into your `MainActivity.java` file, and consists of a single public class named `CodePush`. +### Java API Reference (Android) + #### CodePush Constructs the CodePush client runtime and represents the `ReactPackage` instance that you add to you app's list of packages. diff --git a/docs/multi-deployment-testing-android.md b/docs/multi-deployment-testing-android.md index 5de29661f..8d61bd97e 100644 --- a/docs/multi-deployment-testing-android.md +++ b/docs/multi-deployment-testing-android.md @@ -10,7 +10,7 @@ The [Android Gradle plugin](https://google.github.io/android-gradle-dsl/current/ To set this up, perform the following steps: -**For React Native >= v0.60** +**For React Native >= v0.76** 1. Open the project's app level `build.gradle` file (for example `android/app/build.gradle` in standard React Native projects) @@ -51,98 +51,5 @@ To set this up, perform the following steps: *NOTE: The naming convention for `releaseStaging` is significant due to [this line](https://github.com/facebook/react-native/blob/e083f9a139b3f8c5552528f8f8018529ef3193b9/react.gradle#L79).* -**For React Native v0.29 - v0.59** - -1. Open up your `MainApplication.java` file and make the following changes: - - ```java - @Override - protected List getPackages() { - return Arrays.asList( - ... - new CodePush(BuildConfig.CODEPUSH_KEY, MainApplication.this, BuildConfig.DEBUG), // Add/change this line. - ... - ); - } - ``` - -2. Open your app's `build.gradle` file (for example `android/app/build.gradle` in standard React Native projects) - -3. Find the `android { buildTypes {} }` section and define `buildConfigField` entries for both your `debug` and `release` build types, which reference your `Staging` and `Production` deployment keys respectively. If you prefer, you can define the key literals in your `gradle.properties` file, and then reference them here. Either way will work, and it's just a matter of personal preference. - - ```groovy - android { - ... - buildTypes { - debug { - ... - // Note: CodePush updates should not be tested in Debug mode as they are overriden by the RN packager. However, because CodePush checks for updates in all modes, we must supply a key. - buildConfigField "String", "CODEPUSH_KEY", '""' - ... - } - - releaseStaging { - ... - buildConfigField "String", "CODEPUSH_KEY", '""' - // Note: It is a good idea to provide matchingFallbacks for the new buildType you create to prevent build issues - // Add the following line if not already there - matchingFallbacks = ['release'] - ... - } - - release { - ... - buildConfigField "String", "CODEPUSH_KEY", '""' - ... - } - } - ... - } - ``` - - *NOTE: The naming convention for `releaseStaging` is significant due to [this line](https://github.com/facebook/react-native/blob/e083f9a139b3f8c5552528f8f8018529ef3193b9/react.gradle#L79).* - -4. Pass the deployment key to the `CodePush` constructor via the build config you defined, as opposed to a string literal. - -**For React Native v0.19 - v0.28** - -Open up your `MainActivity.java` file and make the following changes: - - ```java - @Override - protected List getPackages() { - return Arrays.asList( - ... - new CodePush(BuildConfig.CODEPUSH_KEY, this, BuildConfig.DEBUG), // Add/change this line. - ... - ); - } - ``` - -*Note: If you gave your build setting a different name in your Gradle file, simply make sure to reflect that in your Java code.* - -And that's it! Now when you run or build your app, your debug builds will automatically be configured to sync with your `Staging` deployment, and your release builds will be configured to sync with your `Production` deployment. - -*NOTE: By default, the `react-native run-android` command builds and deploys the debug version of your app, so if you want to test out a release/production build, simply run `react-native run-android --variant release. Refer to the [React Native docs](http://facebook.github.io/react-native/docs/signed-apk-android.html#conten) for details about how to configure and create release builds for your Android apps.* - -If you want to be able to install both debug and release builds simultaneously on the same device (highly recommended!), then you need to ensure that your debug build has a unique identity and icon from your release build. Otherwise, neither the OS nor you will be able to differentiate between the two. You can achieve this by performing the following steps: - -1. In your `build.gradle` file, specify the [`applicationIdSuffix`](http://google.github.io/android-gradle-dsl/current/com.android.build.gradle.internal.dsl.BuildType.html#com.android.build.gradle.internal.dsl.BuildType:applicationIdSuffix) field for your debug build type, which gives your debug build a unique identity for the OS (like `com.foo` vs. `com.foo.debug`). - -```groovy -buildTypes { - debug { - applicationIdSuffix ".debug" - } -} -``` - -2. Create the `app/src/debug/res` directory structure in your app, which allows overriding resources (like strings, icons, layouts) for your debug builds - -3. Create a `values` directory underneath the debug res directory created in #2, and copy the existing `strings.xml` file from the `app/src/main/res/values` directory - -4. Open up the new debug `strings.xml` file and change the `` element's value to something else (like `foo-debug`). This ensures that your debug build now has a distinct display name, so that you can differentiate it from your release build. - -5. Optionally, create "mirrored" directories in the `app/src/debug/res` directory for all of your app's icons that you want to change for your debug build. This part isn't technically critical, but it can make it easier to quickly spot your debug builds on a device if its icon is noticeable different. And that's it! View [here](http://tools.android.com/tech-docs/new-build-system/resource-merging) for more details on how resource merging works in Android. diff --git a/docs/setup-android.md b/docs/setup-android.md index bbf7e342c..232c60aa2 100644 --- a/docs/setup-android.md +++ b/docs/setup-android.md @@ -1,23 +1,12 @@ ## Android Setup -* [Plugin Installation and Configuration for React Native 0.60 version and above](#plugin-installation-and-configuration-for-react-native-060-version-and-above-android) -* [Plugin Installation for React Native lower than 0.60 (Android)](#plugin-installation-for-react-native-lower-than-060-android) - * [Plugin Installation (Android - RNPM)](#plugin-installation-android---rnpm) - * [Plugin Installation (Android - Manual)](#plugin-installation-android---manual) -* [Plugin Configuration for React Native lower than 0.60 (Android)](#plugin-configuration-for-react-native-lower-than-060-android) - * [For React Native v0.29 - v0.59](#for-react-native-v029---v059) - * [For newly created React Native application](#for-newly-created-react-native-application) - * [For existing native application](#for-existing-native-application) - * [For React Native v0.19 - v0.28](#for-react-native-v019---v028) - * [Background React Instances](#background-react-instances) - * [For React Native >= v0.29 (Background React Instances)](#for-react-native--v029-background-react-instances) - * [For React Native v0.19 - v0.28 (Background React Instances)](#for-react-native-v019---v028-background-react-instances) - * [WIX React Native Navigation applications (ver 1.x)](#wix-react-native-navigation-applications) +* [Plugin Installation and Configuration for React Native 0.76 version and above](#plugin-installation-and-configuration-for-react-native-060-version-and-above-android) * [Code Signing setup](#code-signing-setup) In order to integrate CodePush into your Android project, please perform the following steps: -### Plugin Installation and Configuration for React Native 0.60 version and above (Android) +### Plugin Installation and Configuration for React Native 0.76 version and above (Android) + 1. In your `android/app/build.gradle` file, add the `codepush.gradle` file as an additional build task definition to the end of the file: @@ -29,7 +18,9 @@ In order to integrate CodePush into your Android project, please perform the fol 2. Update the `MainApplication` file to use CodePush via the following changes: - For React Native 0.73 and above: update the `MainApplication.kt` + For React Native 0.76 and above: update the `MainApplication.kt` + + **Important! : PackageList must be instantiated only one in application lifetime.** ```kotlin ... @@ -60,28 +51,6 @@ In order to integrate CodePush into your Android project, please perform the fol } ``` - For React Native 0.72 and below: update the `MainApplication.java` - - ```java - ... - // 1. Import the plugin class. - import com.microsoft.codepush.react.CodePush; - - public class MainApplication extends Application implements ReactApplication { - - private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) { - ... - - // 2. Override the getJSBundleFile method in order to let - // the CodePush runtime determine where to get the JS - // bundle location from on each app start - @Override - protected String getJSBundleFile() { - return CodePush.getJSBundleFile(); - } - }; - } - ``` 3. Add the Deployment key to `strings.xml`: @@ -102,350 +71,10 @@ In order to integrate CodePush into your Android project, please perform the fol *Note: If you need to dynamically use a different deployment, you can also override your deployment key in JS code using [Code-Push options](./api-js.md#CodePushOptions)* -### Plugin Installation for React Native lower than 0.60 (Android) - -In order to accommodate as many developer preferences as possible, the CodePush plugin supports Android installation via two mechanisms: - -1. [**RNPM**](#plugin-installation-android---rnpm) - [React Native Package Manager (RNPM)](https://github.com/rnpm/rnpm) is an awesome tool that provides the simplest installation experience possible for React Native plugins. If you're already using it, or you want to use it, then we recommend this approach. - -2. [**"Manual"**](#plugin-installation-android---manual) - If you don't want to depend on any additional tools or are fine with a few extra installation steps (it's a one-time thing), then go with this approach. - -*Note: Due to a code change from the React Native repository, if your installed React Native version ranges from 0.29 to 0.32, we recommend following the manual steps to set up correctly. * - -#### Plugin Installation (Android - RNPM) - -1. As of v0.27 of React Native, `rnpm link` has already been merged into the React Native CLI. Simply run: - ``` - react-native link react-native-code-push - ``` - - If your app uses a version of React Native that is lower than v0.27, run the following: - ``` - rnpm link react-native-code-push - ``` - - *Note: If you don't already have RNPM installed, you can do so by simply running `npm i -g rnpm` and then executing the above command.* - -2. If you're using RNPM >=1.6.0, you will be prompted for the deployment key you'd like to use. If you don't already have it, you can retrieve this value by running `appcenter codepush deployment list -a / -k`, or you can choose to ignore it (by simply hitting ``) and add it in later. To get started, we would recommend just using your `Staging` deployment key, so that you can test out the CodePush end-to-end. - -And that's it for installation using RNPM! Continue below to the [Plugin Configuration](#plugin-configuration-for-react-native-lower-than-060-android) section to complete the setup. - -#### Plugin Installation (Android - Manual) - -1. In your `android/settings.gradle` file, make the following additions: - - ```gradle - include ':app', ':react-native-code-push' - project(':react-native-code-push').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-code-push/android/app') - ``` - -2. In your `android/app/build.gradle` file, add the `:react-native-code-push` project as a compile-time dependency: - - ```gradle - ... - dependencies { - ... - compile project(':react-native-code-push') - } - ``` - -3. In your `android/app/build.gradle` file, add the `codepush.gradle` file as an additional build task definition underneath `react.gradle`: - - ```gradle - ... - apply from: "../../node_modules/react-native/react.gradle" - apply from: "../../node_modules/react-native-code-push/android/codepush.gradle" - ... - ``` - -### Plugin Configuration for React Native lower than 0.60 (Android) - -*NOTE: If you used RNPM or `react-native link` to automatically link the plugin, these steps have already been done for you so you may skip this section.* - -After installing the plugin and syncing your Android Studio project with Gradle, you need to configure your app to consult CodePush for the location of your JS bundle, since it will "take control" of managing the current and all future versions. To do this: - -#### For React Native v0.29 - v0.59 - -##### For newly created React Native application - -If you are integrating Code Push into React Native application please do the following steps: - -Update the `MainApplication.java` file to use CodePush via the following changes: - -```java -... -// 1. Import the plugin class. -import com.microsoft.codepush.react.CodePush; - -public class MainApplication extends Application implements ReactApplication { - - private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) { - ... - // 2. Override the getJSBundleFile method in order to let - // the CodePush runtime determine where to get the JS - // bundle location from on each app start - @Override - protected String getJSBundleFile() { - return CodePush.getJSBundleFile(); - } - - @Override - protected List getPackages() { - // 3. Instantiate an instance of the CodePush runtime and add it to the list of - // existing packages, specifying the right deployment key. If you don't already - // have it, you can run "appcenter codepush deployment list -a / -k" to retrieve your key. - return Arrays.asList( - new MainReactPackage(), - new CodePush("deployment-key-here", MainApplication.this, BuildConfig.DEBUG) - ); - } - }; -} -``` - -*NOTE: For React Native v0.49+ please be sure that `getJSMainModuleName` function in the `MainApplication.java` file determines correct URL to fetch JS bundle (used when dev support is enabled, see [this](https://github.com/facebook/react-native/blob/c7f37074ac89f7e568ca26a6bad3bdb02812c39f/ReactAndroid/src/main/java/com/facebook/react/ReactNativeHost.java#L124) for more details) e.g.* -``` -@Override -protected String getJSMainModuleName() { - return "index"; -} -``` - -##### For existing native application - -If you are integrating React Native into existing native application please do the following steps: - -Update `MyReactActivity.java` (it could be named differently in your app) file to use CodePush via the following changes: - -```java -... -// 1. Import the plugin class. -import com.microsoft.codepush.react.CodePush; - -public class MyReactActivity extends Activity { - private ReactRootView mReactRootView; - private ReactInstanceManager mReactInstanceManager; - - @Override - protected void onCreate(Bundle savedInstanceState) { - ... - mReactInstanceManager = ReactInstanceManager.builder() - // ... - // Add CodePush package - .addPackage(new CodePush("deployment-key-here", getApplicationContext(), BuildConfig.DEBUG)) - // Get the JS Bundle File via Code Push - .setJSBundleFile(CodePush.getJSBundleFile()) - // ... - - .build(); - mReactRootView.startReactApplication(mReactInstanceManager, "MyReactNativeApp", null); - - setContentView(mReactRootView); - } - - ... -} -``` - -#### For React Native v0.19 - v0.28 - -Update the `MainActivity.java` file to use CodePush via the following changes: - -```java -... -// 1. Import the plugin class (if you used RNPM to install the plugin, this -// should already be done for you automatically so you can skip this step). -import com.microsoft.codepush.react.CodePush; - -public class MainActivity extends ReactActivity { - // 2. Override the getJSBundleFile method in order to let - // the CodePush runtime determine where to get the JS - // bundle location from on each app start - @Override - protected String getJSBundleFile() { - return CodePush.getJSBundleFile(); - } - - @Override - protected List getPackages() { - // 3. Instantiate an instance of the CodePush runtime and add it to the list of - // existing packages, specifying the right deployment key. If you don't already - // have it, you can run "appcenter codepush deployment list -a / -k" to retrieve your key. - return Arrays.asList( - new MainReactPackage(), - new CodePush("deployment-key-here", this, BuildConfig.DEBUG) - ); - } - - ... -} -``` - -#### Background React Instances - -*This section is only necessary if you're explicitly launching a React Native instance without an `Activity` (for example, from within a native push notification receiver). For these situations, CodePush must be told how to find your React Native instance.* - -In order to update/restart your React Native instance, CodePush must be configured with a `ReactInstanceHolder` before attempting to restart an instance in the background. This is done in your `Application` implementation. - -##### For React Native >= v0.29 (Background React Instances) - -Update the `MainApplication.java` file to use CodePush via the following changes: - -```java -... -// 1. Declare your ReactNativeHost to extend ReactInstanceHolder. ReactInstanceHolder is a subset of ReactNativeHost, so no additional implementation is needed. -import com.microsoft.codepush.react.ReactInstanceHolder; - -public class MyReactNativeHost extends ReactNativeHost implements ReactInstanceHolder { - // ... usual overrides -} - -// 2. Provide your ReactNativeHost to CodePush. - -public class MainApplication extends Application implements ReactApplication { - - private final MyReactNativeHost mReactNativeHost = new MyReactNativeHost(this); - - @Override - public void onCreate() { - CodePush.setReactInstanceHolder(mReactNativeHost); - super.onCreate(); - } -} -``` - -##### For React Native v0.19 - v0.28 (Background React Instances) - -Before v0.29, React Native did not provide a `ReactNativeHost` abstraction. If you're launching a background instance, you'll likely have built your own, which should now implement `ReactInstanceHolder`. Once that's done: - -```java -// 1. Provide your ReactInstanceHolder to CodePush. - -public class MainApplication extends Application { - - @Override - public void onCreate() { - // ... initialize your instance holder - CodePush.setReactInstanceHolder(myInstanceHolder); - super.onCreate(); - } -} -``` In order to effectively make use of the `Staging` and `Production` deployments that were created along with your CodePush app, refer to the [multi-deployment testing](../README.md#multi-deployment-testing) docs below before actually moving your app's usage of CodePush into production. -#### WIX React Native Navigation applications - -If you are using [WIX React Native Navigation **version 1.x**](https://github.com/wix/react-native-navigation) based application, please do the following steps to integrate CodePush: - -1. No need to change `MainActivity.java` file, so if you are integrating CodePush to newly created RNN application it might be looking like this: - -```java -import com.facebook.react.ReactActivity; -import com.reactnativenavigation.controllers.SplashActivity; -public class MainActivity extends SplashActivity { - -} -``` - -2. Update the `MainApplication.java` file to use CodePush via the following changes: - -```java -// ... -import com.facebook.react.ReactInstanceManager; - -// Add CodePush imports -import com.microsoft.codepush.react.ReactInstanceHolder; -import com.microsoft.codepush.react.CodePush; - -public class MainApplication extends NavigationApplication implements ReactInstanceHolder { - - @Override - public boolean isDebug() { - // Make sure you are using BuildConfig from your own application - return BuildConfig.DEBUG; - } - - protected List getPackages() { - // Add additional packages you require here - return Arrays.asList( - new CodePush("deployment-key-here", getApplicationContext(), BuildConfig.DEBUG) - ); - } - - @Override - public List createAdditionalReactPackages() { - return getPackages(); - } - - @Override - public String getJSBundleFile() { - // Override default getJSBundleFile method with the one CodePush is providing - return CodePush.getJSBundleFile(); - } - - @Override - public String getJSMainModuleName() { - return "index"; - } - - @Override - public ReactInstanceManager getReactInstanceManager() { - // CodePush must be told how to find React Native instance - return getReactNativeHost().getReactInstanceManager(); - } -} -``` -If you are using [WIX React Native Navigation **version 2.x**](https://github.com/wix/react-native-navigation/tree/v2) based application, please do the following steps to integrate CodePush: - -1. As per React Native Navigation's documentation, `MainActivity.java` should extend `NavigationActivity`, no changes required to incorporate CodePush: - -```java -import com.reactnativenavigation.NavigationActivity; - -public class MainActivity extends NavigationActivity { - -} -``` - -2. Update the `MainApplication.java` file to use CodePush via the following changes: - -```java -// ... -import com.facebook.react.ReactInstanceManager; - -// Add CodePush imports -import com.microsoft.codepush.react.CodePush; - -public class MainApplication extends NavigationApplication { - - @Override - public boolean isDebug() { - return BuildConfig.DEBUG; - } - - @Override - protected ReactGateway createReactGateway() { - ReactNativeHost host = new NavigationReactNativeHost(this, isDebug(), createAdditionalReactPackages()) { - @javax.annotation.Nullable - @Override - protected String getJSBundleFile() { - return CodePush.getJSBundleFile(); - } - - }; - return new ReactGateway(this, isDebug(), host); - } - - @Override - public List createAdditionalReactPackages() { - return Arrays.asList( - new CodePush("deployment-key-here", getApplicationContext(), isDebug()) - //,MainReactPackage , etc... - } -} -``` ### Code Signing setup @@ -468,23 +97,7 @@ zwIDAQAB ``` -#### For React Native <= v0.60 you should configure the `CodePush` instance to use this parameter using one of the following approaches - -##### Using constructor - -```java -new CodePush( - "deployment-key", - getApplicationContext(), - BuildConfig.DEBUG, - R.string.CodePushPublicKey) -``` - -##### Using builder - - ```java -new CodePushBuilder("deployment-key-here",getApplicationContext()) - .setIsDebugMode(BuildConfig.DEBUG) - .setPublicKeyResourceDescriptor(R.string.CodePushPublicKey) - .build() -``` +### Expo Integration +1. A pure expo react-native is not supported yet. We are planning to look into this after a while. See https://github.com/CodePushNext/react-native-code-push/issues/5 +2. A bare react-native app with expo sdk is supported, but you have to initialize rn app without `ReactNativeHostWrapper` of expo. It seems `ReactNativeHostWrapper` overrides `getJsBundleFile` internally, which prevents `CodePush` from being configured correctly. + https://github.com/expo/expo/issues/25865 diff --git a/docs/setup-ios.md b/docs/setup-ios.md index 7a02369bc..226659457 100644 --- a/docs/setup-ios.md +++ b/docs/setup-ios.md @@ -2,7 +2,7 @@ Once you've acquired the CodePush plugin, you need to integrate it into the Xcode project of your React Native app and configure it correctly. To do this, take the following steps: ​ -### Plugin Installation and Configuration for React Native 0.60 version and above (iOS) +### Plugin Installation and Configuration for React Native 0.76 version and above (iOS) 1. Run `cd ios && pod install && cd ..` to install all the necessary CocoaPods dependencies. ​ @@ -52,177 +52,6 @@ Once you've acquired the CodePush plugin, you need to integrate it into the Xcod *Note: If you need to dynamically use a different deployment, you can also override your deployment key in JS code using [Code-Push options](./api-js.md#CodePushOptions)* -### Plugin Installation for React Native lower than 0.60 (iOS) - -In order to accommodate as many developer preferences as possible, the CodePush plugin supports iOS installation via three mechanisms: - -1. [**RNPM**](#plugin-installation-ios---rnpm) - [React Native Package Manager (RNPM)](https://github.com/rnpm/rnpm) is an awesome tool that provides the simplest installation experience possible for React Native plugins. If you're already using it, or you want to use it, then we recommend this approach. - -2. [**CocoaPods**](#plugin-installation-ios---cocoapods) - If you're building a native iOS app that is embedding React Native into it, or you simply prefer using [CocoaPods](https://cocoapods.org), then we recommend using the Podspec file that we ship as part of our plugin. - -3. [**"Manual"**](#plugin-installation-ios---manual) - If you don't want to depend on any additional tools or are fine with a few extra installation steps (it's a one-time thing), then go with this approach. - -#### Plugin Installation (iOS - RNPM) - -1. As of v0.27 of React Native, `rnpm link` has already been merged into the React Native CLI. Simply run: - ``` - react-native link react-native-code-push - ``` - - If your app uses a version of React Native that is lower than v0.27, run the following: - ``` - rnpm link react-native-code-push - ``` - - *Note: If you don't already have RNPM installed, you can do so by simply running `npm i -g rnpm` and then executing the above command. If you already have RNPM installed, make sure you have v1.9.0+ in order to benefit from this one step install.* - -2. You will be prompted for the deployment key you'd like to use. If you don't already have it, you can retrieve this value by running `appcenter codepush deployment list -a / -k`, or you can choose to ignore it (by simply hitting ``) and add it in later. To get started, we would recommend just using your `Staging` deployment key, so that you can test out the CodePush end-to-end. - -And that's it! Isn't RNPM awesome? :) - -#### Plugin Installation (iOS - CocoaPods) - -1. Add the ReactNative and CodePush plugin dependencies to your `Podfile`, pointing at the path where NPM installed it - - ``` - # React Native requirements - pod 'React', :path => '../node_modules/react-native', :subspecs => [ - 'Core', - 'CxxBridge', # Include this for RN >= 0.47 - 'DevSupport', # Include this to enable In-App Devmenu if RN >= 0.43 - 'RCTText', - 'RCTNetwork', - 'RCTWebSocket', # Needed for debugging - 'RCTAnimation', # Needed for FlatList and animations running on native UI thread - # Add any other subspecs you want to use in your project - ] - # Explicitly include Yoga if you are using RN >= 0.42.0 - pod 'yoga', :path => '../node_modules/react-native/ReactCommon/yoga' - pod 'DoubleConversion', :podspec => '../node_modules/react-native/third-party-podspecs/DoubleConversion.podspec' - pod 'glog', :podspec => '../node_modules/react-native/third-party-podspecs/glog.podspec' - pod 'Folly', :podspec => '../node_modules/react-native/third-party-podspecs/Folly.podspec' - - # CodePush plugin dependency - pod 'CodePush', :path => '../node_modules/react-native-code-push' - ``` - - *NOTE: The above path needs to be relative to your app's `Podfile`, so adjust it as necessary.* - - *NOTE: `JWT` library should be >= version 3.0.x* - -2. Run `pod install` - -*NOTE: The CodePush `.podspec` depends on the `React` pod, and so in order to ensure that it can correctly use the version of React Native that your app is built with, please make sure to define the `React` dependency in your app's `Podfile` as explained [here](https://facebook.github.io/react-native/docs/integration-with-existing-apps.html#podfile).* - -#### Plugin Installation (iOS - Manual) - -1. Open your app's Xcode project - -2. Find the `CodePush.xcodeproj` file within the `node_modules/react-native-code-push/ios` directory (or `node_modules/react-native-code-push` for <=`1.7.3-beta` installations) and drag it into the `Libraries` node in Xcode - - ![Add CodePush to project](https://cloud.githubusercontent.com/assets/8598682/13368613/c5c21422-dca0-11e5-8594-c0ec5bde9d81.png) - -3. Select the project node in Xcode and select the "Build Phases" tab of your project configuration. - -4. Drag `libCodePush.a` from `Libraries/CodePush.xcodeproj/Products` into the "Link Binary With Libraries" section of your project's "Build Phases" configuration. - - ![Link CodePush during build](https://cloud.githubusercontent.com/assets/516559/10322221/a75ea066-6c31-11e5-9d88-ff6f6a4d6968.png) - -5. Click the plus sign underneath the "Link Binary With Libraries" list and select the `libz.tbd` library underneath the `iOS 9.1` node. - - ![Libz reference](https://cloud.githubusercontent.com/assets/116461/11605042/6f786e64-9aaa-11e5-8ca7-14b852f808b1.png) - - *Note: Alternatively, if you prefer, you can add the `-lz` flag to the `Other Linker Flags` field in the `Linking` section of the `Build Settings`.* - - -### Plugin Configuration for React Native lower than 0.60 (iOS) - -*NOTE: If you used RNPM or `react-native link` to automatically link the plugin, these steps have already been done for you so you may skip this section.* - -Once your Xcode project has been setup to build/link the CodePush plugin, you need to configure your app to consult CodePush for the location of your JS bundle, since it is responsible for synchronizing it with updates that are released to the CodePush server. To do this, perform the following steps: - -1. Open up the `AppDelegate.m` file, and add an import statement for the CodePush headers: - - ```objective-c - #import - ``` - -For React Native 0.59 - 0.59.10: - -2. Find the following line of code, which sets the source URL for bridge for production releases: - - ```objective-c - return [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"]; - ``` - -3. Replace it with this line: - - ```objective-c - return [CodePush bundleURL]; - ``` - -For React Native 0.58 and below: - -2. Find the following line of code, which loads your JS Bundle from the app binary for production releases: - - ```objective-c - jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index" fallbackResource:nil]; - ``` - -3. Replace it with this line: - - ```objective-c - jsCodeLocation = [CodePush bundleURL]; - ``` - -This change configures your app to always load the most recent version of your app's JS bundle. On the first launch, this will correspond to the file that was compiled with the app. However, after an update has been pushed via CodePush, this will return the location of the most recently installed update. - -*NOTE: The `bundleURL` method assumes your app's JS bundle is named `main.jsbundle`. If you have configured your app to use a different file name, simply call the `bundleURLForResource:` method (which assumes you're using the `.jsbundle` extension) or `bundleURLForResource:withExtension:` method instead, in order to overwrite that default behavior* - -Typically, you're only going to want to use CodePush to resolve your JS bundle location within release builds, and therefore, we recommend using the `DEBUG` pre-processor macro to dynamically switch between using the packager server and CodePush, depending on whether you are debugging or not. This will make it much simpler to ensure you get the right behavior you want in production, while still being able to use the Chrome Dev Tools, live reload, etc. at debug-time. - -For React Native 0.59 - 0.59.10: - -```objective-c -- (NSURL *)sourceURLForBridge:(RCTBridge *)bridge -{ - #if DEBUG - return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index" fallbackResource:nil]; - #else - return [CodePush bundleURL]; - #endif -} -``` - -For React Native 0.49 - 0.58: - -```objective-c -NSURL *jsCodeLocation; - -#ifdef DEBUG - jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index" fallbackResource:nil]; -#else - jsCodeLocation = [CodePush bundleURL]; -#endif -``` - -For React Native 0.48 and below: - -```objective-c -NSURL *jsCodeLocation; - -#ifdef DEBUG - jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/index.ios.bundle?platform=ios&dev=true"]; -#else - jsCodeLocation = [CodePush bundleURL]; -#endif -``` - -To let the CodePush runtime know which deployment it should query for updates against, open your app's `Info.plist` file and add a new entry named `CodePushDeploymentKey`, whose value is the key of the deployment you want to configure this app against (like the key for the `Staging` deployment for the `FooBar` app). You can retrieve this value by running `appcenter codepush deployment list -a / -k` in the AppCenter CLI (the `-k` flag is necessary since keys aren't displayed by default) and copying the value of the `Key` column which corresponds to the deployment you want to use (see below). Note that using the deployment's name (like Staging) will not work. That "friendly name" is intended only for authenticated management usage from the CLI, and not for public consumption within your app. - -![Deployment list](https://cloud.githubusercontent.com/assets/116461/11601733/13011d5e-9a8a-11e5-9ce2-b100498ffb34.png) - -In order to effectively make use of the `Staging` and `Production` deployments that were created along with your CodePush app, refer to the [multi-deployment testing](../README.md#multi-deployment-testing) docs below before actually moving your app's usage of CodePush into production. ### HTTP exception domains configuration (iOS)