How to install cordova/phonegap plugins on PhoneGap Developer App

Question

I'm trying to add this plugin to a PhoneGap application.

I used this command:

$ cordova plugin add cordova-media-with-compression

And I can see the plugin correctly added in the list of plugins running this:

$ phonegap plugin list

But when I use the PhoneGap Developer App (on iPhone) the plugin is not available.

I'm running this code in order to get the list of installed plugins at runtime:

document.addEventListener("deviceready", function () {

  var pluginList = cordova.require("cordova/plugin_list").metadata;
  console.log(JSON.stringify(pluginList));

});

The above code returns two different sets of plugins if I run the application from a browser or from the PhoneGap Developer App. From browser I get this:

{
  "cordova-media-with-compression": "2.1.0",
  "cordova-plugin-battery-status": "1.1.2",
  "cordova-plugin-camera": "2.1.1",
  "cordova-plugin-compat": "1.1.0",
  "cordova-plugin-console": "1.0.4",
  "cordova-plugin-contacts": "2.0.1",
  "cordova-plugin-device": "1.1.3",
  "cordova-plugin-device-motion": "1.2.2",
  "cordova-plugin-device-orientation": "1.0.4",
  "cordova-plugin-dialogs": "1.2.1",
  "cordova-plugin-file": "4.3.0",
  "cordova-plugin-file-transfer": "1.5.1",
  "cordova-plugin-geolocation": "2.1.0",
  "cordova-plugin-globalization": "1.0.4",
  "cordova-plugin-inappbrowser": "1.3.0",
  "cordova-plugin-network-information": "1.2.1",
  "cordova-plugin-splashscreen": "3.2.2",
  "cordova-plugin-statusbar": "2.1.3",
  "cordova-plugin-vibration": "2.1.2",
  "cordova-plugin-whitelist": "1.2.2"
}

And from the PhoneGap Developer App I get this:

{
  "com.wikitude.phonegap.WikitudePlugin": "5.3.0",
  "cordova-plugin-battery-status": "1.2.0",
  "cordova-plugin-ble-central": "1.1.2",
  "cordova-plugin-camera": "2.3.0",
  "cordova-plugin-compat": "1.0.0",
  "cordova-plugin-console": "1.0.4",
  "cordova-plugin-contacts": "2.2.0",
  "cordova-plugin-device": "1.1.3",
  "cordova-plugin-device-motion": "1.2.2",
  "cordova-plugin-device-orientation": "1.0.4",
  "cordova-plugin-dialogs": "1.3.0",
  "cordova-plugin-file": "4.3.0",
  "cordova-plugin-file-transfer": "1.6.0",
  "cordova-plugin-geolocation": "2.4.1-dev",
  "cordova-plugin-globalization": "1.0.4",
  "cordova-plugin-inappbrowser": "1.5.0",
  "cordova-plugin-insomnia": "4.2.0",
  "cordova-plugin-media": "2.4.0",
  "cordova-plugin-media-capture": "1.4.0",
  "cordova-plugin-network-information": "1.3.0",
  "cordova-plugin-splashscreen": "4.0.0",
  "cordova-plugin-statusbar": "2.2.0",
  "cordova-plugin-whitelist": "1.3.0",
  "cordova-plugin-x-socialsharing": "5.1.3",
  "phonegap-plugin-barcodescanner": "6.0.3",
  "phonegap-plugin-contentsync": "1.2.5",
  "phonegap-plugin-mobile-accessibility": "1.0.4",
  "phonegap-plugin-push": "1.8.3"
}

As you can see, in the first list there is the plugin cordova-media-with-compression while in the second list there is not.

Why the two list of plugins are not equals? How can I get new installed plugins also in the PhoneGap Developer App?

Answer 1

I found out that the Phonegap Developer App come with a set of plugins out of the box and it is not possible to add other external plugins: http://docs.phonegap.com/references/developer-app/troubleshoot-faq/

If you're using a plugin in your project that is not shown in this list, it will not work with the PhoneGap Developer App out of the box. However, you can create your own custom build of the PhoneGap Developer app locally and include any other plugins there.

The official suggestion is to create a custom build of the Developer App.

These are some discussions on github about this issue:

https://github.com/phonegap/phonegap-app-developer/issues/247 https://github.com/phonegap/phonegap-app-developer/issues/209