xref: /expo/docs/pages/bare/installing-updates.mdx (revision 600cd0cc)
1---
2title: Add expo-updates to an existing project
3description: Learn how to add expo-updates to an existing React Native project.
4---
5
6import { Terminal } from '~/ui/components/Snippet';
7
8The `expo-updates` library fetches and manages updates received from a remote server. It supports [EAS Update](/eas-update/introduction), a hosted service that serves updates for projects using the `expo-updates` library.
9
10> If you are creating a new project, we recommend using `npx create-expo-app --template bare-minimum` (or `yarn create expo-app --template bare-minimum`) instead of `npx react-native init` because it will handle the following configuration for you automatically. It includes the `expo-updates` [config plugin](/config-plugins/introduction/), which will handle the following steps for you.
11
12## Installation
13
14The `expo-updates` library requires that your project already has [Expo modules configured](/bare/installing-expo-modules). Be sure to install it before continuing.
15
16To get started, install `expo-updates`:
17
18<Terminal cmd={['$ npx expo install expo-updates']} />
19
20Then, install pods:
21
22<Terminal cmd={['$ npx pod-install']} />
23
24Once installation is complete, apply the changes from the following diffs to configure `expo-updates` in your project.
25
26## Configuration in JavaScript and JSON
27
28Modify the `expo` section of **app.json**. (If you originally created your app using `npx react-native init`, you will need to add this section.)
29The changes below add the updates URL to the Expo configuration.
30
31> The example URL shown here is for use with a custom update server running on the same machine. When using EAS Update, the EAS CLI will set this URL correctly for the EAS Update service.
32
33```diff app.json
34 {
35   "name": "MyApp",
36-  "displayName": "MyApp"
37+  "displayName": "MyApp",
38+  "expo": {
39+    "name": "MyApp",
40+    "slug": "MyApp",
41+    "ios": {
42+      "bundleIdentifier": "com.MyApp"
43+    },
44+    "android": {
45+      "package": "com.MyApp"
46+    },
47+    "runtimeVersion": "1.0.0",
48+    "updates": {
49+      "url": "http://localhost:3000/api/manifest"
50+    }
51+  }
52 }
53```
54
55
56## Configuration for iOS
57
58Add the file **Podfile.properties.json** to the **ios** directory:
59
60```json ios/Podfile.properties.json
61{
62  "expo.jsEngine": "hermes"
63}
64```
65
66Modify **ios/Podfile** to check for the JS engine configuration (JSC or Hermes) in Expo files:
67
68```diff ios/Podfile
69--- a/ios/Podfile
70+++ b/ios/Podfile
71@@ -2,6 +2,9 @@ require File.join(File.dirname(`node --print "require.resolve('expo/package.json
72 require_relative '../node_modules/react-native/scripts/react_native_pods'
73 require_relative '../node_modules/@react-native-community/cli-platform-ios/native_modules'
74
75+require 'json'
76+podfile_properties = JSON.parse(File.read(File.join(__dir__, 'Podfile.properties.json'))) rescue {}
77+
78 platform :ios, '13.0'
79 prepare_react_native_project!
80
81@@ -41,7 +44,7 @@ target 'MyApp' do
82     # Hermes is now enabled by default. Disable by setting this flag to false.
83     # Upcoming versions of React Native may rely on get_default_flags(), but
84     # we make it explicit here to aid in the React Native upgrade process.
85-    :hermes_enabled => flags[:hermes_enabled],
86+    :hermes_enabled => podfile_properties['expo.jsEngine'] == nil || podfile_properties['expo.jsEngine'] == 'hermes',
87     :fabric_enabled => flags[:fabric_enabled],
88     # Enables Flipper.
89     #
90
91```
92Add the **Supporting** directory containing **Expo.plist** to your project in Xcode with the following content, to match the content in **app.json**:
93
94```xml Expo.plist
95<?xml version="1.0" encoding="UTF-8"?>
96<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
97<plist version="1.0">
98  <dict>
99    <key>EXUpdatesCheckOnLaunch</key>
100    <string>ALWAYS</string>
101    <key>EXUpdatesEnabled</key>
102    <true/>
103    <key>EXUpdatesLaunchWaitMs</key>
104    <integer>0</integer>
105    <key>EXUpdatesRuntimeVersion</key>
106    <string>1.0.0</string>
107    <key>EXUpdatesURL</key>
108    <string>http://localhost:3000/api/manifest</string>
109  </dict>
110</plist>
111```
112
113## Configuration for Android
114
115Modify **android/app/build.gradle** to check for the JS engine configuration (JSC or Hermes) in Expo files:
116
117```diff android/app/build.gradle
118--- a/android/app/build.gradle
119+++ b/android/app/build.gradle
120@@ -52,6 +52,11 @@ react {
121     // hermesFlags = ["-O", "-output-source-map"]
122 }
123
124+// Override `hermesEnabled` by `expo.jsEngine`
125+ext {
126+  hermesEnabled = (findProperty('expo.jsEngine') ?: "hermes") == "hermes"
127+}
128+
129 /**
130  * Set this to true to create four separate APKs instead of one,
131  * one for each native architecture. This is useful if you don't
132```
133
134Modify **android/app/src/main/AndroidManifest.xml** to add the `expo-updates` configuration XML so that it matches the contents of **app.json**:
135
136```diff android/app/src/main/AndroidManifest.xml
137--- a/android/app/src/main/AndroidManifest.xml
138+++ b/android/app/src/main/AndroidManifest.xml
139@@ -9,6 +9,11 @@
140       android:roundIcon="@mipmap/ic_launcher_round"
141       android:allowBackup="false"
142       android:theme="@style/AppTheme">
143+      <meta-data android:name="expo.modules.updates.ENABLED" android:value="true"/>
144+      <meta-data android:name="expo.modules.updates.EXPO_RUNTIME_VERSION" android:value="@string/expo_runtime_version"/>
145+      <meta-data android:name="expo.modules.updates.EXPO_UPDATES_CHECK_ON_LAUNCH" android:value="ALWAYS"/>
146+      <meta-data android:name="expo.modules.updates.EXPO_UPDATES_LAUNCH_WAIT_MS" android:value="0"/>
147+      <meta-data android:name="expo.modules.updates.EXPO_UPDATE_URL" android:value="http://localhost:3000/api/manifest"/>
148       <activity
149         android:name=".MainActivity"
150         android:label="@string/app_name"
151```
152
153Add the Expo runtime version string key to **android/app/src/main/res/values/strings.xml**:
154
155```diff android/app/src/main/res/values/strings.xml
156--- a/android/app/src/main/res/values/strings.xml
157+++ b/android/app/src/main/res/values/strings.xml
158@@ -1,3 +1,4 @@
159 <resources>
160     <string name="app_name">MyApp</string>
161+    <string name="expo_runtime_version">1.0.0</string>
162 </resources>
163```
164
165## Next Steps
166
167See more information about usage in the [`expo-updates` README](https://github.com/expo/expo/tree/main/packages/expo-updates/README.md).
168
169See [this guide](/eas-update/eas-update-with-local-build/) for trying out EAS Update with a local build.
170
171To start trying out EAS Update with EAS Build, see the [EAS Update "Getting Started" guide](/eas-update/getting-started/).
172
173It is also possible to use `expo-updates` with a custom server that implements the [Expo Updates protocol](/technical-specs/expo-updates-1/); see the [`custom-expo-updates-server` README](https://github.com/expo/custom-expo-updates-server#readme).
174