Migrating to the Capacitor Live Updates plugin

If you are currently using the Cordova Live Updates plugin in your Capacitor v5+ app, then you can use the new Capacitor equivalent plugin to take advantage of performance improvements and a more unified configuration.

To remove the Cordova plugin from your Capacitor app, first uninstall cordova-plugin-ionic:

$ npm uninstall cordova-plugin-ionic

Next, remove the iOS live updates configuration from your ios/App/App/Info.plist:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
  <dict>
    ...
    # Remove these lines:
    <key>IonAppId</key>
    <string>abcd1234</string>
    <key>IonChannelName</key>
    <string>Production</string>
    <key>IonUpdateMethod</key>
    <string>background</string>
    <key>IonMaxVersions</key>
    <string>2</string>
    <key>IonMinBackgroundDuration</key>
    <string>30</string>
    <key>IonApi</key>
    <string>https://api.ionicjs.com</string>
  </dict>
</plist>

Finally, remove the Android live updates configuration from your android/app/src/main/res/values/strings.xml:

<?xml version='1.0' encoding='utf-8'?>
<resources>
  ...
  # Remove these lines:
  <string name="ionic_app_id">abcd1234</string>
  <string name="ionic_channel_name">Production</string>
  <string name="ionic_update_method">background</string>
  <string name="ionic_max_versions">2</string>
  <string name="ionic_min_background_duration">30</string>
  <string name="ionic_update_api">https://api.ionicjs.com</string>
</resources>

Now, with the Cordova plugin fully removed, we can install the Capacitor plugin by installing the latest version specified here.

$ npm install @capacitor/live-updates@<reference linked documentation>
$ npx cap sync

Lastly, we can enable the live updates plugin by appending our config to your capacitor.config.[ts|js|json]. For example:

import { CapacitorConfig } from '@capacitor/cli';

const config: CapacitorConfig = {
 appId: 'com.company.appname',
 appName: 'My Capacitor App',
 webDir: 'www',
 plugins: {
   LiveUpdates: {
     appId: 'abcd1234',
     channel: 'Production',
     autoUpdateMethod: 'background',
     maxVersions: 2
   }
 }
};

export default config;

Further details regarding different live update strategies can be found here.

With the Capacitor plugin installed and configured, you can now create a new native build and begin releasing live updates!