Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

unable to create app, invalid file type in Phonegap build

I am learning Phone-gap for the first time. This is a simple app. But whenever I am trying to build it is showing me

unable to create app, invalid file type.

I am showing code of index.html file and config file bellow.

index.html

      <!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <meta name="format-detection" content="telephone=no" />
    <meta name="msapplication-tap-highlight" content="no" />
    <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width" />
    <!-- This is a wide open CSP declaration. To lock this down for production, see below. -->
    <meta http-equiv="Content-Security-Policy" content="default-src * 'unsafe-inline'; style-src 'self' 'unsafe-inline'; media-src *" />
    <!-- Good default declaration:
    * gap: is required only on iOS (when using UIWebView) and is needed for JS->native communication
    * https://ssl.gstatic.com is required only on Android and is needed for TalkBack to function properly
    * Disables use of eval() and inline scripts in order to mitigate risk of XSS vulnerabilities. To change this:
        * Enable inline JS: add 'unsafe-inline' to default-src
        * Enable eval(): add 'unsafe-eval' to default-src
    * Create your own at http://cspisawesome.com
    -->
    <!-- <meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: 'unsafe-inline' https://ssl.gstatic.com; style-src 'self' 'unsafe-inline'; media-src *" /> -->

    <link rel="stylesheet" type="text/css" href="css/index.css" />
    <title>hybrid app</title>
</head>

<body>
    <div class="container">
        <div id="sidebar">
          <ul>
            <li><a href="#">Home</a></li>
            <li><a href="#">Blog</a></li>
            <li><a href="#">Contact</a></li>
            <li><a href="#">About</a></li>
          </ul>
        </div>
        <div class="main-content">
          <div class="swipe-area"></div>
          <a href="#" data-toggle=".container" id="sidebar-toggle"> <span class="bar"></span> <span class="bar"></span> <span class="bar"></span> </a>
          <div class="content">
            <h1>Hybrid App</h1>
            <div class="jquery-script-ads"><script type="text/javascript"><!--
google_ad_client = "ca-pub-2783044520727903";
/* jQuery_demo */
google_ad_slot = "2780937993";
google_ad_width = 728;
google_ad_height = 90;
//-->
</script>

</div> </div>

 <div class="para">
            <p>Hybrid Mobile Applications. Hybrid development combines the best (or worst) of both the native and HTML5 worlds. We define hybrid as a web app, primarily built using HTML5 and JavaScript, that is then wrapped inside a thin native container that provides access to native platform features.</p>

         </div>

         <div>
           <a href=""><img src="www\com.phonegap.hello-world\master\template_src\www\native_html_hybrid_apps_development_1920_700_1.jpg" width="1300" height="700" alt=""></a>
         </div>

        </div>
      </div>
    <script type="text/javascript" src="cordova.js"></script>
    <script type="text/javascript" src="js/index.js"></script>
     <script src="http://code.jquery.com/jquery-1.11.3.min.js"></script> 
      <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.touchswipe/1.6.4/jquery.touchSwipe.min.js"></script> 
      <script>
  $(window).load(function(){
        $("[data-toggle]").click(function() {
          var toggle_el = $(this).data("toggle");
          $(toggle_el).toggleClass("open-sidebar");
        });
         $(".swipe-area").swipe({
              swipeStatus:function(event, phase, direction, distance, duration, fingers)
                  {
                      if (phase=="move" && direction =="right") {
                           $(".container").addClass("open-sidebar");
                           return false;
                      }
                      if (phase=="move" && direction =="left") {
                           $(".container").removeClass("open-sidebar");
                           return false;
                      }
                  }
          }); 
      });
</script>

<script type="text/javascript">

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-36251023-1']);
  _gaq.push(['_setDomainName', 'jqueryscript.net']);
  _gaq.push(['_trackPageview']);

  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();

</script>
</body>

</html>

config.xml

      <?xml version="1.0" encoding="UTF-8"?>

<!-- config.xml reference: https://build.phonegap.com/docs/config-xml -->
<widget xmlns     = "http://www.w3.org/ns/widgets"
        xmlns:gap = "http://phonegap.com/ns/1.0"
        id        = "com.phonegap.hybridapp"
        version   = "1.0.0">

    <name>Hybrid App</name>

    <description>
        Hello World sample application that responds to the deviceready event.
    </description>

    <author href="http://phonegap.com" email="[email protected]">
        Nidhin johny
    </author>

    <!-- Define the main entry-point to the application -->
    <www/res/icon/ios/ src="index.html" />

    <!-- Customize your app and platform with the preference element. -->
    <preference name="DisallowOverscroll"         value="true" />
    <!-- android: MIN SDK version supported on the target device. MAX version is blank by default. -->
    <preference name="android-minSdkVersion"      value="14" />

    <!-- Define a specific version of PhoneGap to build into your app. -->
    <!-- <preference name="phonegap-version"       value="cli-6.0.0" /> -->

    <!-- Plugins -->
    <!-- Core plugins -->
    <plugin name="cordova-plugin-battery-status"      source="npm" spec="~1.1.1" />
    <plugin name="cordova-plugin-camera"              source="npm" spec="~2.1.1" />
    <plugin name="cordova-plugin-media-capture"       source="npm" spec="~1.2.0" />
    <plugin name="cordova-plugin-console"             source="npm" spec="~1.0.2" />
    <plugin name="cordova-plugin-contacts"            source="npm" spec="~2.0.1" />
    <plugin name="cordova-plugin-device"              source="npm" spec="~1.1.1" />
    <plugin name="cordova-plugin-device-motion"       source="npm" spec="~1.2.0" />
    <plugin name="cordova-plugin-device-orientation"  source="npm" spec="~1.0.2" />
    <plugin name="cordova-plugin-dialogs"             source="npm" spec="~1.2.0" />
    <plugin name="cordova-plugin-file"                source="npm" spec="~4.1.1" />
    <plugin name="cordova-plugin-file-transfer"       source="npm" spec="~1.5.0" />
    <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-inappbrowser"        source="npm" spec="~1.3.0" />
    <plugin name="cordova-plugin-media"               source="npm" spec="~2.2.0" />
    <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-vibration"           source="npm" spec="~2.1.0" />
    <plugin name="cordova-plugin-whitelist"           source="npm" spec="~1.2.1" />

    <!-- Define app icon and splashscreen for each platform. -->
    <icon src="icon.png" />
    <platform name="android">
     <icon src = "www/res/icon/android/icon-36-ldpi.png" 
      gap:platform = "android" gap:qualifier = "ldpi" />

   <icon src = "www/res/icon/android/icon-48-mdpi.png" 
      gap:platform = "android" gap:qualifier = "mdpi" />

   <icon src = "www/res/icon/android/icon-72-hdpi.png" 
      gap:platform = "android" gap:qualifier = "hdpi" />

   <icon src = "www/res/icon/android/icon-96-xhdpi.png" 
      gap:platform = "android" gap:qualifier = "xhdpi" />

   <icon src = "www/res/icon/android/icon-144-xxhdpi.png" 
      gap:platform = "android" gap:qualifier = "xxhdpi" />

  <icon src = "www/res/icon/android/icon-192-xxxhdpi.png" 
      gap:platform = "android" gap:qualifier = "xxxhdpi" />

      <splash src="www/res/screens/android/screen-hdpi-portrait.png"    density="hdpi" />
        <splash src="www/res/screens/android/screen-ldpi-portrait.png"     density="ldpi"/>
        <splash src="www/res/screens/android/screen-mdpi-portrait.png"    density="mdpi" />
        <splash src="www/res/screens/android/screen-xhdpi-portrait.png"    density="xhdpi" />

   </platform>
    <platform name="ios">
   <icon src = "www/res/icon/ios/icon.png" gap:platform = "ios" gap:qualifier = ""/>
   <icon src = "www/res/icon/ios/icon.png" gap:platform = "ios" width = "57" height = "57" />
   <icon src = "www/res/icon/ios/icon-72.png" gap:platform = "ios" width = "72" height = "72" />
   <icon src = "www/res/icon/ios/icon-2x.png" gap:platform = "ios" width = "114" height = "114" />
   <icon src = "www/res/icon/ios/icon-72-2x.png" gap:platform = "ios" width = "144" height = "144" />
        <splash src="www/res/screen/ios/screen-ipad-portrait.png"     platform="ios" width="768"  height="1024" />
        <splash src="www/res/screen/ios/screen-ipad-portrait-2x.png"  platform="ios" width="1536"  height="2048" />
        <splash src="www/res/screen/ios/screen-iphone-portrait.png"               platform="ios" width="320" height="480" />
        <splash src="www/res/screen/ios/screen-iphone-portrait-2x.png"     platform="ios" width="640" height="960" />
        <splash src="www/res/screen/ios/screen-iphone-portrait-568h-2x.png"  platform="ios" width="640" height="1136" />
         <splash src="www/res/screen/ios/screen-iphone-portrait-667h.png"  platform="ios" width="750" height="1334" />
          <splash src="www/res/screen/ios/screen-iphone-portrait-736h.png"  platform="ios" width="1242" height="2208" />
   </platform>


    <!--
        Define access to external domains.

        <access />            - a blank access tag denies access to all external resources.
        <access origin="*" /> - a wildcard access tag allows access to all external resource.

        Otherwise, you can specify specific domains:
    -->
    <access origin="*" />
    <!--
       <access origin="http://phonegap.com" />                    - allow any secure requests to http://phonegap.com/
       <access origin="http://phonegap.com" subdomains="true" />  - same as above, but including subdomains, such as http://build.phonegap.com/
       <access origin="http://phonegap.com" browserOnly="true" /> - only allows http://phonegap.com to be opened by the child browser.
    -->

    <!-- Added the following intents to support the removal of whitelist code from base cordova to a plugin -->
    <!-- Whitelist configuration. Refer to https://cordova.apache.org/docs/en/edge/guide_appdev_whitelist_index.md.html -->

    <allow-intent href="http://*/*" />
    <allow-intent href="https://*/*" />
    <allow-intent href="tel:*" />
    <allow-intent href="sms:*" />
    <allow-intent href="mailto:*" />
    <allow-intent href="geo:*" />
    <platform name="android">
        <allow-intent href="market:*" />
    </platform>
    <platform name="ios">
        <allow-intent href="itms:*" />
        <allow-intent href="itms-apps:*" />
    </platform>

</widget>

Folder of phone gap enter image description here

I ALSO USE PHONEGAP CLI BUT IT IS NOT WORKING PROPERLY .also attaching screenshot below. enter image description here

like image 734
Nidhin Johny Avatar asked Mar 11 '23 16:03

Nidhin Johny


1 Answers

unable to create app, invalid file type

The error indicates that the file type that you are trying to upload is not valid.

Phonegap Build requires a .zip file to be uploaded. Having a .rar file will not be accepted, please create a zip file of your project and then upload it.

like image 76
Sarantis Tofas Avatar answered Mar 24 '23 19:03

Sarantis Tofas