Cordova Plugins Not Transferring to iOS after Phonegap Build Command

Question

I have been struggling with this for weeks. I developed a native app with Phonegap/Cordova. I used the Phonegap Build cloud service and have an app that works perfectly and is being distributed through the App Store and Google Play. My company is contracting with a government app vendor that requires that the app be buildable from command line and they want me to insert tracking code into the native iOS and Android code.

The issue is: when I navigate to the project folder in command line or terminal and run

phonegap build ios
phonegap build android

I get versions of the app that are missing my splashscreen and icon images and none of the Cordova plugins have transferred over. When I open the iOS .xcodeproject file in Xcode and run the simulator, I have a version of my app that I can navigate around in, but nothing works. I can't click hyperlinks in popups and a geolocation function doesn't work. I've tried manually renaming the plugins folder in the Phonegap/Cordova project folder to "Plugins" with a capital p, and that hasn't worked. There is nothing in the ios.json file in the platform folder.

I'm using Phonegap CLI 8.0.0 Node 8.11.3, npm 5.6.0 OS X El Capitan 10.11.6 Windows 7 Xcode 8.2.1

Here is my config.xml:

<?xml version='1.0' encoding='utf-8'?>
<widget id="com.phonegap.metcon" version="1.0.3" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
    <name>MetCon Weather</name>
    <description>
        Climate and Three Week Charts
    </description>
    <author email="[email protected]" href="http://www.mymetcon.com">
        Levi Cecil
    </author>
    <preference name="phonegap-version" value="cli-8.0.0" />
    <content src="index.html" />
    <access origin="*" />
    <access launch-external="yes" origin="mailto:*" />
    <allow-intent href="http://*/*" launch-external="yes" />
    <allow-intent href="https://*/*" launch-external="yes" />
    <allow-intent href="tel:*" />
    <allow-intent href="sms:*" />
    <allow-intent href="geo:*" />
    <plugin name="cordova-plugin-file" source="npm" spec="~4.1.1" />
    <plugin name="cordova-plugin-geolocation" source="npm" spec="~2.1.0" />
    <plugin name="cordova-plugin-globalization" source="npm" spec="~1.0.3" />
    <plugin name="cordova-plugin-network-information" source="npm" spec="~1.2.0" />
    <plugin name="cordova-plugin-splashscreen" source="npm" spec="~3.2.1" />
    <plugin name="cordova-plugin-statusbar" source="npm" spec="~2.1.2" />
    <plugin name="cordova-plugin-whitelist" source="npm" spec="~1.3.3" />
    <plugin name="cordova-plugin-inappbrowser" source="npm" spec="~1.3.0" />
    <plugin name="cordova-plugin-console" source="npm" spec="~1.1.0" />
    <plugin name="cordova-plugin-device" source="npm" spec="~2.0.2" />
    <plugin name="cordova-plugin-device-motion" source="npm" spec="~2.0.1" />
    <plugin name="cordova-plugin-device-orientation" source="npm" spec="~2.0.1" />
    <plugin name="cordova-plugin-dialogs" source="npm" spec="~2.0.1" />
    <platform name="android">
        <preference name="android-minSdkVersion" value="14" />
        <preference name="android-targetSdkVersion" value="26" />
        <preference name="permissions" value="none" />
        <allow-intent href="market:*" />
    </platform>
    <platform name="ios">
        <allow-intent href="itms:*" />
        <allow-intent href="itms-apps:*" />
        <preference name="BackupWebStorage" value="none" />
    </platform>
    <preference name="DisallowOverscroll" value="true" />
    <platform name="android">
        <icon density="ldpi" src="res/icon/android/drawable-ldpi-icon.png" />
        <icon density="mdpi" src="res/icon/android/drawable-mdpi-icon.png" />
        <icon density="hdpi" src="res/icon/android/drawable-hdpi-icon.png" />
        <icon density="xhdpi" src="res/icon/android/drawable-xhdpi-icon.png" />
        <icon density="xxhdpi" src="res/icon/android/drawable-xxhdpi-icon.png" />
        <icon density="xxxhdpi" src="res/icon/android/drawable-xxxhdpi-icon.png" />
        <splash density="land-ldpi" src="res/screen/android/drawable-land-ldpi-screen.png" />
        <splash density="land-mdpi" src="res/screen/android/drawable-land-mdpi-screen.png" />
        <splash density="land-hdpi" src="res/screen/android/drawable-land-hdpi-screen.png" />
        <splash density="land-xhdpi" src="res/screen/android/drawable-land-xhdpi-screen.png" />
        <splash density="land-xxhdpi" src="res/screen/android/drawable-land-xxhdpi-screen.png" />
        <splash density="land-xxxhdpi" src="res/screen/android/drawable-land-xxxhdpi-screen.png" />
        <splash density="port-ldpi" src="res/screen/android/drawable-port-ldpi-screen.png" />
        <splash density="port-mdpi" src="res/screen/android/drawable-port-mdpi-screen.png" />
        <splash density="port-hdpi" src="res/screen/android/drawable-port-hdpi-screen.png" />
        <splash density="port-xhdpi" src="res/screen/android/drawable-port-xhdpi-screen.png" />
        <splash density="port-xxhdpi" src="res/screen/android/drawable-port-xxhdpi-screen.png" />
        <splash density="port-xxxhdpi" src="res/screen/android/drawable-port-xxxhdpi-screen.png" />
    </platform>
    <platform name="ios">
        <icon height="57" platform="ios" src="res/icon/ios/icon.png" width="57" />
        <icon height="114" platform="ios" src="res/icon/ios/[email protected]" width="114" />
        <icon height="40" platform="ios" src="res/icon/ios/icon-40.png" width="40" />
        <icon height="80" platform="ios" src="res/icon/ios/[email protected]" width="80" />
        <icon height="50" platform="ios" src="res/icon/ios/icon-50.png" width="50" />
        <icon height="100" platform="ios" src="res/icon/ios/[email protected]" width="100" />
        <icon height="60" platform="ios" src="res/icon/ios/icon-60.png" width="60" />
        <icon height="120" platform="ios" src="res/icon/ios/[email protected]" width="120" />
        <icon height="180" platform="ios" src="res/icon/ios/[email protected]" width="180" />
        <icon height="72" platform="ios" src="res/icon/ios/icon-72.png" width="72" />
        <icon height="144" platform="ios" src="res/icon/ios/[email protected]" width="144" />
        <icon height="76" platform="ios" src="res/icon/ios/icon-76.png" width="76" />
        <icon height="152" platform="ios" src="res/icon/ios/[email protected]" width="152" />
        <icon height="29" platform="ios" src="res/icon/ios/icon-small.png" width="29" />
        <icon height="58" platform="ios" src="res/icon/ios/[email protected]" width="58" />
        <icon height="87" platform="ios" src="res/icon/ios/[email protected]" width="87" />
        <splash height="1136" platform="ios" src="res/screen/ios/Default-568h@2x~iphone.png" width="640" />
        <splash height="1334" platform="ios" src="res/screen/ios/Default-667h.png" width="750" />
        <splash height="2208" platform="ios" src="res/screen/ios/Default-736h.png" width="1242" />
        <splash height="1242" platform="ios" src="res/screen/ios/Default-Landscape-736h.png" width="2208" />
        <splash height="1536" platform="ios" src="res/screen/ios/Default-Landscape@2x~ipad.png" width="2048" />
        <splash height="768" platform="ios" src="res/screen/ios/Default-Landscape~ipad.png" width="1024" />
        <splash height="2048" platform="ios" src="res/screen/ios/Default-Portrait@2x~ipad.png" width="1536" />
        <splash height="1024" platform="ios" src="res/screen/ios/Default-Portrait~ipad.png" width="768" />
        <splash height="960" platform="ios" src="res/screen/ios/Default@2x~iphone.png" width="640" />
        <splash height="480" platform="ios" src="res/screen/ios/Default~iphone.png" width="320" />
    </platform>
</widget>

Answer 1

I finally figured this out.

If you've developed your app with PhoneGap Build online and you need to go back and generate native iOS and/or Android versions, follow these steps:

1. Make sure you have your system properly configured for Xcode and/or Android Studio, Java SDK, and the appropriate command line tools for these platforms. There is a lot of information online on how to do this.

2. Create a brand new separate PhoneGap project for each platform in the command line:

   $phonegap create MyiOSApp
   $phonegap create MyAndroidApp

3. In the iOS project, copy your info from your app's config.xml (com.phonegap.your_app_name, author email and website, version number, extra plugins not included in the new config, other preferences and settings) into the new config.xml

4. Delete the new www folder and replace it with yours.

5. Open command line, navigate to the main project folder and type:

   $phonegap build ios

This should take about 30 seconds to a minute. Once it's done, you can open the ios.json file in the platforms>ios folder and confirm that the plugins have been copied over. If the build command only runs for a few seconds, it hasn't built correctly and your ios.json file will be empty. At this point you should delete your new app and start over.

After following these steps. I was able to open the new .xcodeproj file in Xocde and run my app in the simulator and everything worked perfectly.

6. Follow steps 3-5 for the Android project.